#sidetools {
	position: fixed;
	right: 50%;
	margin-right: -795px;
	bottom: 110px;
	width: 60px;
	z-index: 99
}

#sidetools .sidetools-item {
	height: 60px;
	background-color: #fff;
	margin: 15px 0;
	border-radius: 50%;
	text-align: center;
	box-shadow: 0 0 10px 0 rgba(0,0,0,.1);
	line-height: 60px;
	font-size: 20px;
	position: relative
}

#sidetools .sidetools-item span.sidetools-icon {
	display: inline-block;
	margin: 15px;
	width: 30px;
	height: 30px;
	overflow: hidden;
	background-image: url(../image/content-sidetools.png);
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: 0 -30px
}

#sidetools .sidetools-item:nth-child(2) span.sidetools-icon {
	background-position: 0 -60px
}

#sidetools .sidetools-item:nth-child(3) span.sidetools-icon {
	background-position: 0 -150px
}

#sidetools .sidetools-item:nth-child(4) span.sidetools-icon {
	background-position: 0 -90px
}

#sidetools .sidetools-item:nth-child(5) span.sidetools-icon {
	background-position: 0 -120px
}

#sidetools .sidetools-item:nth-child(6) span.sidetools-icon {
	background-position: 0 -150px
}

#sidetools .sidetools-item a {
	display: block;
	width: 100%;
	height: 60px;
	color: #999
}

.macwk-about-section {
	position: relative;
	padding: 115px 0 170px;
	overflow: hidden
}

.macwk-about-section .main-content {
	position: relative;
	border-radius: 20px;
	box-shadow: 0 16px 25px 0 rgba(0,0,0,.03);
	padding: 80px 70px 55px;
	z-index: 5
}

.macwk-about-section .main-content:before {
	content: url(../image/icon28.svg);
	position: absolute;
	top: 50px;
	left: 50%;
	transform: translateX(-50%);
	opacity: .04
}

.macwk-about-section .inner-container {
	width: 50%;
	margin: 60px auto 0;
	position: relative;
	z-index: 1;
	text-align: center
}

.macwk-about-section .inner-container:before {
	content: "";
	position: absolute;
	bottom: -30px;
	left: 35px;
	right: 35px;
	height: 200px;
	border-radius: 20px;
	box-shadow: 0 15px 23px 0 rgba(35,49,64,.09);
	z-index: -1
}

.macwk-about-section .inner-container:after {
	content: "";
	position: absolute;
	bottom: -55px;
	left: 80px;
	right: 80px;
	height: 200px;
	border-radius: 20px;
	box-shadow: 0 14px 21px 0 rgba(0,0,0,.03);
	z-index: -3
}

.macwk-about-section .inner-container p {
	font-size: 20px;
	line-height: 40px
}

.macwk-about-section .people {
	position: absolute;
	width: 110px;
	height: 110px
}

.macwk-about-section .people:first-child {
	top: 12%;
	left: 18%;
	-webkit-animation: scale-up-one 14s linear infinite;
	animation: scale-up-one 14s linear infinite
}

.macwk-about-section .people:nth-child(2) {
	top: 44%;
	left: 9%;
	-webkit-animation: scale-up-two 9s linear infinite;
	animation: scale-up-two 9s linear infinite
}

.macwk-about-section .people:nth-child(3) {
	bottom: 7%;
	left: 15%;
	-webkit-animation: scale-up-three 8s linear infinite;
	animation: scale-up-three 8s linear infinite
}

.macwk-about-section .people:nth-child(4) {
	top: 12%;
	right: 18%;
	-webkit-animation: scale-up-two 10s linear infinite;
	animation: scale-up-two 10s linear infinite
}

.macwk-about-section .people:nth-child(5) {
	top: 42%;
	right: 7%;
	-webkit-animation: scale-up-three 11s linear infinite;
	animation: scale-up-three 11s linear infinite
}

.macwk-about-section .people:nth-child(6) {
	bottom: 7%;
	right: 15%;
	-webkit-animation: scale-up-one 12s linear infinite;
	animation: scale-up-one 12s linear infinite
}

:root {
	--blue: #50a1ff;
	--indigo: #6610f2;
	--purple: #926dde;
	--pink: #e83e8c;
	--red: #ff4954;
	--orange: #ffbe00;
	--yellow: #ffba00;
	--green: #3cd458;
	--teal: #20c997;
	--cyan: #17a2b8;
	--white: #fff;
	--gray: #868e96;
	--gray-dark: #343a40;
	--primary: #50a1ff;
	--secondary: #e9ecf0;
	--success: #3cd458;
	--info: #926dde;
	--warning: #ffba00;
	--danger: #ff4954;
	--light: #F3F5F7;
	--dark: #16202f;
	--breakpoint-xs: 0;
	--breakpoint-sm: 576px;
	--breakpoint-md: 768px;
	--breakpoint-lg: 992px;
	--breakpoint-xl: 1260px;
	--breakpoint-xxl: 1500px;
	--font-family-sans-serif: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
	--font-family-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace
}

*,:after,:before {
	box-sizing: border-box
}

html {
	font-family: sans-serif;
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: rgba(23,23,23,0)
}

aside,footer,header,nav,section {
	display: block
}

body {
	margin: 0;
	font-family: Dosis,Open Sans,pingfang SC,helvetica neue,arial,hiragino sans gb,microsoft yahei ui,microsoft yahei,simsun,sans-serif;
	font-size: .9375rem;
	font-weight: 300;
	line-height: 1.9;
	text-align: left;
	background-color: #fff
}[tabindex="-1"]:focus:not(.focus-visible),[tabindex="-1"]:focus:not(:focus-visible) {
	outline: 0!important
}

h1,h2,h3,h4,h5,h6 {
	margin-top: 0;
	margin-bottom: .5rem
}

p {
	margin-top: 0;
	margin-bottom: 1rem
}

ol,ul {
	margin-bottom: 1rem
}

ol,ul {
	margin-top: 0
}

ol ol,ol ul,ul ol,ul ul {
	margin-bottom: 0
}

blockquote {
	margin: 0 0 1rem
}

b {
	font-weight: bolder
}

small {
	font-size: 80%
}

a {
	color: #50a1ff;
	background-color: transparent
}

a:hover {
	color: #3191ff;
	text-decoration: underline
}

a:not([href]):not([class]),a:not([href]):not([class]):hover {
	color: inherit;
	text-decoration: none
}

code,pre {
	font-family: SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;
	font-size: 1em
}

pre {
	margin-top: 0;
	margin-bottom: 1rem;
	overflow: auto;
	-ms-overflow-style: scrollbar
}

img,svg {
	vertical-align: middle
}

svg {
	overflow: hidden
}

th {
	text-align: inherit;
	text-align: -webkit-match-parent
}

label {
	display: inline-block;
	margin-bottom: .5rem
}

button {
	border-radius: 0
}

button:focus:not(.focus-visible),button:focus:not(:focus-visible) {
	outline: 0
}

button,input,select,textarea {
	margin: 0;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit
}

button,input {
	overflow: visible
}

button,select {
	text-transform: none
}[role=button] {
	cursor: pointer
}

select {
	word-wrap: normal
}[type=button],[type=reset],[type=submit],button {
	-webkit-appearance: button
}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled) {
	cursor: pointer
}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner {
	padding: 0;
	border-style: none
}

input[type=checkbox] {
	box-sizing: border-box;
	padding: 0
}

textarea {
	overflow: auto;
	resize: vertical
}[type=search] {
	outline-offset: -2px;
	-webkit-appearance: none
}[type=search]::-webkit-search-decoration {
	-webkit-appearance: none
}

::-webkit-file-upload-button {
	font: inherit;
	-webkit-appearance: button
}

output {
	display: inline-block
}

template {
	display: none
}[hidden] {
	display: none!important
}

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
	margin-bottom: .5rem;
	font-family: Dosis,Open Sans,pingfang SC,-apple-system,Helvetica Neue,Helvetica,Arial,PingFang SC,PingFang TC,Hiragino Sans GB,Microsoft Yahei,Microsoft Jhenghei,sans-serif;
	line-height: 1.5;
	color: #3c4248
}

.h1,h1 {
	font-size: 2.57812rem
}

.h2,h2 {
	font-size: 2.10938rem
}

.h3,h3 {
	font-size: 1.75781rem
}

.h4,h4 {
	font-size: 1.52344rem
}

.h5,h5 {
	font-size: 1.23047rem
}

.h6,h6 {
	font-size: 1.05469rem
}

.small,small {
	font-size: 85%;
	font-weight: 400
}

code {
	font-size: 87.5%;
	color: #e83e8c;
	word-wrap: break-word
}

a>code {
	color: inherit
}

pre {
	display: block;
	font-size: 87.5%;
	color: #212529
}

pre code {
	font-size: inherit;
	color: inherit;
	word-break: normal
}

.container {
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto
}

@media (min-width:576px) {
	.container {
		max-width: 576px
	}
}

@media (min-width:768px) {
	.container {
		max-width: 768px
	}
}

@media (min-width:992px) {
	.container {
		max-width: 992px
	}
}

@media (min-width:1260px) {
	.container {
		max-width: 1200px
	}
}

@media (min-width:1500px) {
	.container {
		max-width: 1440px
	}
}

.row {
	display: flex;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px
}

.col-3,.col-7,.col-lg-6,.col-md-8,.col-sm-12,.col-xl-6,.col-xxl-10 {
	position: relative;
	width: 100%;
	padding-right: 15px;
	padding-left: 15px
}

.col-3 {
	flex: 0 0 25%;
	max-width: 25%
}

.col-7 {
	flex: 0 0 58.33333%;
	max-width: 58.33333%
}

@media (min-width:576px) {

	.col-sm-12 {
		flex: 0 0 100%;
		max-width: 100%
	}
}

@media (min-width:768px) {

	.col-md-8 {
		flex: 0 0 66.66667%;
		max-width: 66.66667%
	}
}

@media (min-width:992px) {

	.col-lg-6 {
		flex: 0 0 50%;
		max-width: 50%
	}
}

@media (min-width:1260px) {

	.col-xl-6 {
		flex: 0 0 50%;
		max-width: 50%
	}
}

@media (min-width:1500px) {

	.col-xxl-10 {
		flex: 0 0 83.33333%;
		max-width: 83.33333%
	}

	.offset-xxl-1 {
		margin-left: 8.33333%
	}
}

.form-control {
	display: block;
	width: 100%;
	height: calc(1.9em + .75rem + 2px);
	padding: .375rem .75rem;
	font-size: .9375rem;
	line-height: 1.9;
	color: #999;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid hsla(210,8%,51%,.09);
	border-radius: 2px;
	transition: all .3s ease-out
}

@media (prefers-reduced-motion:reduce) {
	.form-control {
		transition: none
	}
}

.form-control::-ms-expand {
	background-color: transparent;
	border: 0
}

.form-control:-moz-focusring {
	color: transparent;
	text-shadow: 0 0 0 #999
}

.form-control:focus {
	color: #3c4248;
	background-color: #fff;
	border-color: hsla(210,8%,51%,.065);
	outline: 0;
	box-shadow: 0 0 40px rgba(0,0,0,.045)
}

.form-control::-moz-placeholder {
	color: #c9ccce;
	opacity: 1
}

.form-control:-ms-input-placeholder {
	color: #c9ccce;
	opacity: 1
}

.form-control::placeholder {
	color: #c9ccce;
	opacity: 1
}

.form-control:disabled {
	background-color: #e9ecef;
	opacity: 1
}

input[type=date].form-control,input[type=time].form-control {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none
}

select.form-control:focus::-ms-value {
	color: #999;
	background-color: #fff
}

select.form-control[size],textarea.form-control {
	height: auto
}

.form-group {
	margin-bottom: 1rem
}

.btn {
	display: inline-block;
	font-weight: 600;
	color: #757575;
	text-align: center;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-color: transparent;
	border: 1px solid transparent;
	padding: .375rem .75rem;
	font-size: .9375rem;
	line-height: 1.9;
	border-radius: .25rem;
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
}

@media (prefers-reduced-motion:reduce) {
	.btn {
		transition: none
	}
}

.btn:hover {
	color: #757575;
	text-decoration: none
}

.btn.focus,.btn:focus {
	outline: 0;
	box-shadow: none
}

.btn.disabled,.btn:disabled {
	opacity: .65
}

.btn:not(:disabled):not(.disabled) {
	cursor: pointer
}

a.btn.disabled {
	pointer-events: none
}

.btn-sm {
	padding: .375rem .5rem;
	font-size: .9375rem;
	line-height: 1.5;
	border-radius: .125rem
}

.btn-block {
	display: block;
	width: 100%
}

.btn-block+.btn-block {
	margin-top: .5rem
}

input[type=button].btn-block,input[type=reset].btn-block,input[type=submit].btn-block {
	width: 100%
}

.fade {
	transition: opacity .15s linear
}

@media (prefers-reduced-motion:reduce) {
	.fade {
		transition: none
	}
}

.fade:not(.show) {
	opacity: 0
}

.input-group {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	width: 100%
}

.input-group>.form-control {
	position: relative;
	flex: 1 1 auto;
	width: 1%;
	min-width: 0;
	margin-bottom: 0
}

.input-group>.form-control+.form-control {
	margin-left: -1px
}

.input-group>.form-control:focus {
	z-index: 3
}

.input-group>.form-control:not(:first-child) {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0
}

.input-group:not(.has-validation)>.form-control:not(:last-child) {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0
}

.input-group-append {
	display: flex
}

.input-group-append .btn {
	position: relative;
	z-index: 2
}

.input-group-append .btn:focus {
	z-index: 3
}

.input-group-append .btn+.btn,.input-group-append .btn+.input-group-text,.input-group-append .input-group-text+.btn,.input-group-append .input-group-text+.input-group-text {
	margin-left: -1px
}

.input-group-append {
	margin-left: -1px
}

.input-group-text {
	padding: .375rem .75rem;
	margin-bottom: 0;
	font-size: .9375rem;
	font-weight: 400;
	line-height: 1.9;
	color: #999;
	text-align: center;
	white-space: nowrap;
	background-color: #e9ecef;
	border: 1px solid hsla(210,8%,51%,.09);
	border-radius: 2px
}

.input-group-text input[type=checkbox] {
	margin-top: 0
}

.input-group:not(.has-validation)>.input-group-append:not(:last-child)>.btn,.input-group:not(.has-validation)>.input-group-append:not(:last-child)>.input-group-text,.input-group>.input-group-append:last-child>.btn:not(:last-child):not(.dropdown-toggle),.input-group>.input-group-append:last-child>.input-group-text:not(:last-child) {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0
}

.input-group>.input-group-append>.btn,.input-group>.input-group-append>.input-group-text {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0
}

.media {
	display: flex;
	align-items: flex-start
}

.close {
	float: right;
	font-size: 1.40625rem;
	font-weight: 600;
	line-height: 1;
	color: #171717;
	text-shadow: none;
	opacity: .5
}

.close:hover {
	color: #171717;
	text-decoration: none
}

.close:not(:disabled):not(.disabled):focus,.close:not(:disabled):not(.disabled):hover {
	opacity: .75
}

button.close {
	padding: 0;
	background-color: transparent;
	border: 0
}

a.close.disabled {
	pointer-events: none
}

.border {
	border: 1px solid hsla(210,8%,51%,.09)!important
}

.border-top {
	border-top: 1px solid hsla(210,8%,51%,.09)!important
}

.border-right {
	border-right: 1px solid hsla(210,8%,51%,.09)!important
}

.border-bottom {
	border-bottom: 1px solid hsla(210,8%,51%,.09)!important
}

.border-left {
	border-left: 1px solid hsla(210,8%,51%,.09)!important
}

.rounded {
	border-radius: .25rem!important
}

.clearfix:after {
	display: block;
	clear: both;
	content: ""
}

.d-block {
	display: block!important
}

.d-flex {
	display: flex!important
}

@media (min-width:768px) {
	.d-md-none {
		display: none!important
	}
}

@media (min-width:992px) {
	.d-lg-none {
		display: none!important
	}
}

@media (min-width:1260px) {

	.d-xl-block {
		display: block!important
	}
}

.flex-row {
	flex-direction: row!important
}

.flex-column {
	flex-direction: column!important
}

.flex-wrap {
	flex-wrap: wrap!important
}

.flex-grow-1 {
	flex-grow: 1!important
}

.justify-content-end {
	justify-content: flex-end!important
}

.justify-content-center {
	justify-content: center!important
}

.align-items-center {
	align-items: center!important
}

.overflow-hidden {
	overflow: hidden!important
}

.position-relative {
	position: relative!important
}

.position-absolute {
	position: absolute!important
}

.w-50 {
	width: 50%!important
}

.w-20 {
	width: 20%!important
}

.w-60 {
	width: 60%!important
}

.w-80 {
	width: 80%!important
}

.h-50 {
	height: 50%!important
}

.h-20 {
	height: 20%!important
}

.text-right {
	text-align: right!important
}

.text-center {
	text-align: center!important
}

.text-uppercase {
	text-transform: uppercase!important
}

.font-weight-bolder {
	font-weight: bolder!important
}

.text-white {
	color: #fff!important
}

.text-primary {
	color: #50a1ff!important
}

a.text-primary:focus,a.text-primary:hover {
	color: #0478ff!important
}

.text-success {
	color: #3cd458!important
}

a.text-success:focus,a.text-success:hover {
	color: #23a03a!important
}

.text-danger {
	color: #ff4954!important
}

a.text-danger:focus,a.text-danger:hover {
	color: #fc000f!important
}

.text-light {
	color: #F3F5F7!important
}

a.text-light:focus,a.text-light:hover {
	color: #c2d4e5!important
}

.text-muted {
	color: #979b9e!important
}

.visible {
	visibility: visible!important
}

@media print {
	*,:after,:before {
		text-shadow: none!important;
		box-shadow: none!important
	}

	a:not(.btn) {
		text-decoration: underline
	}

	pre {
		white-space: pre-wrap!important
	}

	blockquote,pre {
		border: 1px solid #adb5bd;
		page-break-inside: avoid
	}

	img {
		page-break-inside: avoid
	}

	h2,h3,p {
		orphans: 3;
		widows: 3
	}

	h2,h3 {
		page-break-after: avoid
	}

	.container,body {
		min-width: 992px!important
	}

	.navbar {
		display: none
	}
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:200;src:url(../font/HhyaU5sn9vOmLzlnC_W6EQ.9b0cb2c.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+1ea0-1ef9,U+20ab
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:200;src:url(../font/HhyaU5sn9vOmLzlmC_W6EQ.cca894b.woff2) format("woff2");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:200;src:url(../font/HhyaU5sn9vOmLzloC_U.43eb9ab.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:400;src:url(../font/HhyaU5sn9vOmLzlnC_W6EQ.9b0cb2c.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+1ea0-1ef9,U+20ab
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:400;src:url(../font/HhyaU5sn9vOmLzlmC_W6EQ.cca894b.woff2) format("woff2");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:400;src:url(../font/HhyaU5sn9vOmLzloC_U.43eb9ab.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:500;src:url(../font/HhyaU5sn9vOmLzlnC_W6EQ.9b0cb2c.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+1ea0-1ef9,U+20ab
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:500;src:url(../font/HhyaU5sn9vOmLzlmC_W6EQ.cca894b.woff2) format("woff2");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:500;src:url(../font/HhyaU5sn9vOmLzloC_U.43eb9ab.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:600;src:url(../font/HhyaU5sn9vOmLzlnC_W6EQ.9b0cb2c.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+1ea0-1ef9,U+20ab
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:600;src:url(../font/HhyaU5sn9vOmLzlmC_W6EQ.cca894b.woff2) format("woff2");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff
}

@font-face {
	font-family:Dosis;font-style:normal;font-weight:600;src:url(../font/HhyaU5sn9vOmLzloC_U.43eb9ab.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd
}

.device,.device:after,.device:before,.device :not([class*=el-carousel__]),.device :not([class*=el-carousel__]):after,.device :not([class*=el-carousel__]):before {
	box-sizing: border-box;
	display: block
}

.device {
	position: relative;
	transform: scale(1)
}

.device,.device .device-frame {
	z-index: 1
}

.device-macbook-pro {
	height: 444px;
	width: 740px
}

.device-macbook-pro .device-frame {
	background: #0d0d0d;
	border-radius: 20px;
	box-shadow: inset 0 0 0 2px #c8cacb;
	height: 403px;
	margin: 0 auto;
	padding: 13px 13px 13px;
	position: relative;
	width: 642px;
}

.device-macbook-pro .device-frame:after {
	background: #272727;
	border-radius: 0 0 20px 20px;
	bottom: 2px;
	content: "";
	height: 26px;
	left: 2px;
	position: absolute;
	width: 610px
}

.device-macbook-pro .device-power {
	background: #e2e3e4;
	border-radius: 2px 2px 0 0;
	border: solid #d5d6d8;
	border-width: 2px 4px 0;
	height: 14px;
	margin-top: -10px;
	position: relative;
	width: 740px;
	z-index: 9
}

.device-macbook-pro .device-power:after,.device-macbook-pro .device-power:before {
	content: "";
	position: absolute
}

.device-macbook-pro .device-power:after {
	background: #d5d6d8;
	border-radius: 0 0 10px 10px;
	box-shadow: inset 0 0 4px 2px #babdbf;
	height: 10px;
	left: 50%;
	margin-left: -60px;
	top: -2px;
	width: 120px
}

.device-macbook-pro .device-power:before {
	background: #a0a3a7;
	border-radius: 0 0 180px 180px/0 0 12px 12px;
	box-shadow: inset 0 -2px 6px 0 #474a4d;
	height: 12px;
	left: -4px;
	margin: 0 auto;
	top: 10px;
	width: 740px
}

@font-face {
	font-family:macwk;src:url(../font/macwk.15d0d30.ttf) format("truetype");font-weight:400;font-style:normal
}[class*=" icon-"]:not(.icon-box),[class^=icon-]:not(.icon-box) {
	font-family: macwk!important;
	speak: none;
	font-style: normal;
	font-weight: 400;
	font-feature-settings: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	display: inline-block;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale
}

.icon-comment:before {
	content: "\e602"
}

.icon-arrow-r:before {
	content: "\e628"
}

.icon-arrow-right:before {
	content: "\e649"
}

.icon-office:before {
	content: "\e651"
}

.icon-like:before {
	content: "\e6a2"
}

.icon-code:before {
	content: "\e6ef"
}

.icon-cp:before {
	content: "\e713"
}

.icon-gallery:before {
	content: "\e71e"
}

.icon-check-circle:before {
	content: "\e920"
}

.icon-circle:before {
	content: "\e921"
}

.icon-disc:before {
	content: "\e922"
}

.icon-clock:before {
	content: "\e92d"
}

.icon-bubble:before {
	content: "\e92e"
}

.icon-heart:before {
	content: "\e932"
}

.icon-download2:before {
	content: "\e936"
}

.icon-search:before {
	content: "\e93c"
}

.icon-share:before {
	content: "\e944"
}

.icon-smile:before {
	content: "\e951"
}

.icon-chevron-down:before {
	content: "\e956"
}

.icon-chevron-right:before {
	content: "\e958"
}

.icon-next-arrow:before {
	content: "\f104"
}

.icon-close:before {
	content: "\f109"
}

.icon-weibo:before {
	content: "\f18a"
}

.icon-qq:before {
	content: "\f1d6"
}

@-webkit-keyframes puffIn {
	0% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(2);
		filter: blur(2px)
	}

	to {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(1);
		filter: blur(0)
	}
}

@keyframes puffIn {
	0% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(2);
		filter: blur(2px)
	}

	to {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(1);
		filter: blur(0)
	}
}

@-webkit-keyframes vanishIn {
	0% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(2);
		filter: blur(90px)
	}

	to {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(1);
		filter: blur(0)
	}
}

@keyframes vanishIn {
	0% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(2);
		filter: blur(90px)
	}

	to {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(1);
		filter: blur(0)
	}
}

@-webkit-keyframes vanishInSmall {
	0% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(1.5);
		filter: blur(90px)
	}

	to {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(1);
		filter: blur(0)
	}
}

@keyframes vanishInSmall {
	0% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(1.5);
		filter: blur(90px)
	}

	to {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(1);
		filter: blur(0)
	}
}

@-webkit-keyframes swashIn {
	0% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(0)
	}

	90% {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(.9)
	}

	to {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(1)
	}
}

@keyframes swashIn {
	0% {
		opacity: 0;
		transform-origin: 50% 50%;
		transform: scale(0)
	}

	90% {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(.9)
	}

	to {
		opacity: 1;
		transform-origin: 50% 50%;
		transform: scale(1)
	}
}

@-webkit-keyframes spaceInDown {
	0% {
		opacity: 0;
		transform-origin: 50% 100%;
		transform: scale(.2) translateY(200%)
	}

	to {
		opacity: 1;
		transform-origin: 50% 100%;
		transform: scale(1) translate(0)
	}
}

@keyframes spaceInDown {
	0% {
		opacity: 0;
		transform-origin: 50% 100%;
		transform: scale(.2) translateY(200%)
	}

	to {
		opacity: 1;
		transform-origin: 50% 100%;
		transform: scale(1) translate(0)
	}
}

@-webkit-keyframes spaceInLeft {
	0% {
		opacity: 0;
		transform-origin: 0 50%;
		transform: scale(.2) translate(-200%)
	}

	to {
		opacity: 1;
		transform-origin: 0 50%;
		transform: scale(1) translate(0)
	}
}

@keyframes spaceInLeft {
	0% {
		opacity: 0;
		transform-origin: 0 50%;
		transform: scale(.2) translate(-200%)
	}

	to {
		opacity: 1;
		transform-origin: 0 50%;
		transform: scale(1) translate(0)
	}
}

@-webkit-keyframes spaceInUp {
	0% {
		opacity: 0;
		transform-origin: 50% 0;
		transform: scale(.2) translateY(-200%)
	}

	to {
		opacity: 1;
		transform-origin: 50% 0;
		transform: scale(1) translate(0)
	}
}

@keyframes spaceInUp {
	0% {
		opacity: 0;
		transform-origin: 50% 0;
		transform: scale(.2) translateY(-200%)
	}

	to {
		opacity: 1;
		transform-origin: 50% 0;
		transform: scale(1) translate(0)
	}
}

@-webkit-keyframes spaceOutUp {
	0% {
		opacity: 1;
		transform-origin: 50% 0;
		transform: scale(1) translate(0)
	}

	to {
		opacity: 0;
		transform-origin: 50% 0;
		transform: scale(.2) translateY(-200%)
	}
}

@keyframes spaceOutUp {
	0% {
		opacity: 1;
		transform-origin: 50% 0;
		transform: scale(1) translate(0)
	}

	to {
		opacity: 0;
		transform-origin: 50% 0;
		transform: scale(.2) translateY(-200%)
	}
}

@-webkit-keyframes perspectiveDownReturn {
	0% {
		transform-origin: 0 100%;
		transform: perspective(800px) rotateX(-180deg)
	}

	to {
		transform-origin: 0 100%;
		transform: perspective(800px) rotateX(0deg)
	}
}

@keyframes perspectiveDownReturn {
	0% {
		transform-origin: 0 100%;
		transform: perspective(800px) rotateX(-180deg)
	}

	to {
		transform-origin: 0 100%;
		transform: perspective(800px) rotateX(0deg)
	}
}

@-webkit-keyframes slideDown {
	0% {
		transform-origin: 0 0;
		transform: translateY(0)
	}

	to {
		transform-origin: 0 0;
		transform: translateY(100%)
	}
}

@keyframes slideDown {
	0% {
		transform-origin: 0 0;
		transform: translateY(0)
	}

	to {
		transform-origin: 0 0;
		transform: translateY(100%)
	}
}

@-webkit-keyframes slideDownReturn {
	0% {
		transform-origin: 0 0;
		transform: translateY(100%)
	}

	to {
		transform-origin: 0 0;
		transform: translateY(0)
	}
}

@keyframes slideDownReturn {
	0% {
		transform-origin: 0 0;
		transform: translateY(100%)
	}

	to {
		transform-origin: 0 0;
		transform: translateY(0)
	}
}

@-webkit-keyframes slideLeftReturn {
	0% {
		transform-origin: 0 0;
		transform: translateX(-100%)
	}

	to {
		transform-origin: 0 0;
		transform: translateX(0)
	}
}

@keyframes slideLeftReturn {
	0% {
		transform-origin: 0 0;
		transform: translateX(-100%)
	}

	to {
		transform-origin: 0 0;
		transform: translateX(0)
	}
}

@-webkit-keyframes slideRight {
	0% {
		transform-origin: 0 0;
		transform: translateX(0)
	}

	to {
		transform-origin: 0 0;
		transform: translateX(100%)
	}
}

@keyframes slideRight {
	0% {
		transform-origin: 0 0;
		transform: translateX(0)
	}

	to {
		transform-origin: 0 0;
		transform: translateX(100%)
	}
}

@-webkit-keyframes slideUpReturn {
	0% {
		transform-origin: 0 0;
		transform: translateY(-100%)
	}

	to {
		transform-origin: 0 0;
		transform: translateY(0)
	}
}

@keyframes slideUpReturn {
	0% {
		transform-origin: 0 0;
		transform: translateY(-100%)
	}

	to {
		transform-origin: 0 0;
		transform: translateY(0)
	}
}

@-webkit-keyframes openUpLeftReturn {
	0% {
		transform-origin: top left;
		transform: rotate(110deg);
		-webkit-animation-timing-function: ease-in-out;
		animation-timing-function: ease-in-out
	}

	to {
		transform-origin: top left;
		transform: rotate(0deg);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out
	}
}

@keyframes openUpLeftReturn {
	0% {
		transform-origin: top left;
		transform: rotate(110deg);
		-webkit-animation-timing-function: ease-in-out;
		animation-timing-function: ease-in-out
	}

	to {
		transform-origin: top left;
		transform: rotate(0deg);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out
	}
}

.tinRightIn {
	-webkit-animation-name: tinRightIn;
	animation-name: tinRightIn
}

@-webkit-keyframes tinRightIn {
	0% {
		opacity: 0;
		transform: scale(1) translateX(900%)
	}

	50%,70%,90% {
		opacity: 1;
		transform: scale(1.1) translateX(0)
	}

	60%,80%,to {
		opacity: 1;
		transform: scale(1) translateX(0)
	}
}

@keyframes tinRightIn {
	0% {
		opacity: 0;
		transform: scale(1) translateX(900%)
	}

	50%,70%,90% {
		opacity: 1;
		transform: scale(1.1) translateX(0)
	}

	60%,80%,to {
		opacity: 1;
		transform: scale(1) translateX(0)
	}
}

@-webkit-keyframes tinRightOut {
	0%,20%,40%,50% {
		opacity: 1;
		transform: scale(1) translateX(0)
	}

	10%,30% {
		opacity: 1;
		transform: scale(1.1) translateX(0)
	}

	to {
		opacity: 0;
		transform: scale(1) translateX(900%)
	}
}

@keyframes tinRightOut {
	0%,20%,40%,50% {
		opacity: 1;
		transform: scale(1) translateX(0)
	}

	10%,30% {
		opacity: 1;
		transform: scale(1.1) translateX(0)
	}

	to {
		opacity: 0;
		transform: scale(1) translateX(900%)
	}
}

.tinUpIn {
	-webkit-animation-name: tinUpIn;
	animation-name: tinUpIn
}

@-webkit-keyframes tinUpIn {
	0% {
		opacity: 0;
		transform: scale(1) translateY(-900%)
	}

	50%,70%,90% {
		opacity: 1;
		transform: scale(1.1) translateY(0)
	}

	60%,80%,to {
		opacity: 1;
		transform: scale(1) translateY(0)
	}
}

@keyframes tinUpIn {
	0% {
		opacity: 0;
		transform: scale(1) translateY(-900%)
	}

	50%,70%,90% {
		opacity: 1;
		transform: scale(1.1) translateY(0)
	}

	60%,80%,to {
		opacity: 1;
		transform: scale(1) translateY(0)
	}
}

@-webkit-keyframes tinUpOut {
	0%,20%,40%,50% {
		opacity: 1;
		transform: scale(1) translateY(0)
	}

	10%,30% {
		opacity: 1;
		transform: scale(1.1) translateY(0)
	}

	to {
		opacity: 0;
		transform: scale(1) translateY(-900%)
	}
}

@keyframes tinUpOut {
	0%,20%,40%,50% {
		opacity: 1;
		transform: scale(1) translateY(0)
	}

	10%,30% {
		opacity: 1;
		transform: scale(1.1) translateY(0)
	}

	to {
		opacity: 0;
		transform: scale(1) translateY(-900%)
	}
}

@-webkit-keyframes zanUpOut {
	0%,20%,40%,50% {
		opacity: 1;
		transform: scale(1) translateY(0)
	}

	10%,30% {
		opacity: 1;
		transform: scale(1.1) translateY(0)
	}

	70%,80%,90% {
		opacity: 0;
		transform: scale(1) translateY(-900%)
	}

	to {
		opacity: 1;
		transform: scale(1) translateY(0)
	}
}

@keyframes zanUpOut {
	0%,20%,40%,50% {
		opacity: 1;
		transform: scale(1) translateY(0)
	}

	10%,30% {
		opacity: 1;
		transform: scale(1.1) translateY(0)
	}

	70%,80%,90% {
		opacity: 0;
		transform: scale(1) translateY(-900%)
	}

	to {
		opacity: 1;
		transform: scale(1) translateY(0)
	}
}

.macwk-animation {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

.macwk-animation.slow {
	-webkit-animation-duration: 2s;
	animation-duration: 2s
}

.slide-fade-enter-active,.slide-fade-leave-active {
	transition: opacity .35s,transform .4s
}

.slide-fade-enter {
	opacity: 0;
	transform: translateX(-30%)
}

.slide-fade-leave-to {
	opacity: 0;
	transform: translateX(30%)
}

@-webkit-keyframes leftIn {
	0% {
		transform: translateX(-50px);
		opacity: 0
	}

	to {
		transform: translateX(0);
		opacity: 1
	}
}

@keyframes leftIn {
	0% {
		transform: translateX(-50px);
		opacity: 0
	}

	to {
		transform: translateX(0);
		opacity: 1
	}
}

@-webkit-keyframes leftBottomIn {
	0% {
		transform: translate3d(-60px,0,0);
		opacity: 0
	}

	to {
		transform: translateZ(0);
		opacity: 1
	}
}

@keyframes leftBottomIn {
	0% {
		transform: translate3d(-60px,0,0);
		opacity: 0
	}

	to {
		transform: translateZ(0);
		opacity: 1
	}
}

.macwk-animation .list-animation-leftIn {
	-webkit-animation-name: leftIn;
	animation-name: leftIn;
	-webkit-animation-duration: 1s;
	animation-duration: 1s
}

.macwk-animation .delay-0 {
	-webkit-animation-delay: 0ms;
	animation-delay: 0ms;
	-webkit-animation-fill-mode: backwards!important;
	animation-fill-mode: backwards!important
}

.macwk-animation .delay-3 {
	-webkit-animation-delay: .15s;
	animation-delay: .15s;
	-webkit-animation-fill-mode: backwards!important;
	animation-fill-mode: backwards!important
}

.macwk-animation .delay-5 {
	-webkit-animation-delay: .25s;
	animation-delay: .25s;
	-webkit-animation-fill-mode: backwards!important;
	animation-fill-mode: backwards!important
}

@-webkit-keyframes jump {
	0% {
		transform: translateZ(0)
	}

	40% {
		transform: translate3d(0,50%,0)
	}

	to {
		transform: translateZ(0)
	}
}

@keyframes jump {
	0% {
		transform: translateZ(0)
	}

	40% {
		transform: translate3d(0,50%,0)
	}

	to {
		transform: translateZ(0)
	}
}

@-webkit-keyframes rotated {
	0% {
		transform: rotate(0)
	}

	to {
		transform: rotate(1turn)
	}
}

@keyframes rotated {
	0% {
		transform: rotate(0)
	}

	to {
		transform: rotate(1turn)
	}
}

@-webkit-keyframes rotatedHalf {
	0% {
		transform: rotate(0)
	}

	50% {
		transform: rotate(90deg)
	}

	to {
		transform: rotate(0)
	}
}

@keyframes rotatedHalf {
	0% {
		transform: rotate(0)
	}

	50% {
		transform: rotate(90deg)
	}

	to {
		transform: rotate(0)
	}
}

@-webkit-keyframes rotatedHalfTwo {
	0% {
		transform: rotate(-90deg)
	}

	to {
		transform: rotate(90deg)
	}
}

@keyframes rotatedHalfTwo {
	0% {
		transform: rotate(-90deg)
	}

	to {
		transform: rotate(90deg)
	}
}

@-webkit-keyframes scale-upOne {
	0% {
		transform: scale(1)
	}

	to {
		transform: scale(.2)
	}
}

@keyframes scale-upOne {
	0% {
		transform: scale(1)
	}

	to {
		transform: scale(.2)
	}
}

@-webkit-keyframes scale-right {
	0% {
		transform: translateX(-50%)
	}

	50% {
		transform: translateX(50%)
	}

	to {
		transform: translateX(-50%)
	}
}

@keyframes scale-right {
	0% {
		transform: translateX(-50%)
	}

	50% {
		transform: translateX(50%)
	}

	to {
		transform: translateX(-50%)
	}
}

@-webkit-keyframes fade-in {
	0% {
		opacity: .7
	}

	40% {
		opacity: 1
	}

	to {
		opacity: .7
	}
}

@keyframes fade-in {
	0% {
		opacity: .7
	}

	40% {
		opacity: 1
	}

	to {
		opacity: .7
	}
}

@-webkit-keyframes hvr-ripple-out {
	0% {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		opacity: 1
	}

	to {
		top: -6px;
		right: -6px;
		bottom: -6px;
		left: -6px;
		opacity: 0
	}
}

@keyframes hvr-ripple-out {
	0% {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		opacity: 1
	}

	to {
		top: -6px;
		right: -6px;
		bottom: -6px;
		left: -6px;
		opacity: 0
	}
}

@-webkit-keyframes hvr-ripple-out-two {
	0% {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		opacity: 1
	}

	to {
		top: -12px;
		right: -12px;
		bottom: -12px;
		left: -12px;
		opacity: 0
	}
}

@keyframes hvr-ripple-out-two {
	0% {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		opacity: 1
	}

	to {
		top: -12px;
		right: -12px;
		bottom: -12px;
		left: -12px;
		opacity: 0
	}
}

@-webkit-keyframes hvr-ripple-out-three {
	0% {
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		opacity: 1
	}

	to {
		left: -10px;
		right: -10px;
		top: -10px;
		bottom: -10px;
		opacity: 0
	}
}

@keyframes hvr-ripple-out-three {
	0% {
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		opacity: 1
	}

	to {
		left: -10px;
		right: -10px;
		top: -10px;
		bottom: -10px;
		opacity: 0
	}
}

@-webkit-keyframes scale-up-one {
	0% {
		transform: scale(1)
	}

	40% {
		transform: scale(.5)
	}

	to {
		transform: scale(1)
	}
}

@keyframes scale-up-one {
	0% {
		transform: scale(1)
	}

	40% {
		transform: scale(.5)
	}

	to {
		transform: scale(1)
	}
}

@-webkit-keyframes scale-up-two {
	0% {
		transform: scale(.5)
	}

	40% {
		transform: scale(.8)
	}

	to {
		transform: scale(.5)
	}
}

@keyframes scale-up-two {
	0% {
		transform: scale(.5)
	}

	40% {
		transform: scale(.8)
	}

	to {
		transform: scale(.5)
	}
}

@-webkit-keyframes scale-up-three {
	0% {
		transform: scale(.7)
	}

	40% {
		transform: scale(.4)
	}

	to {
		transform: scale(.7)
	}
}

@keyframes scale-up-three {
	0% {
		transform: scale(.7)
	}

	40% {
		transform: scale(.4)
	}

	to {
		transform: scale(.7)
	}
}

@keyframes animationFramesOne {
	0% {
		transform: translate(0) rotate(0deg)
	}

	20% {
		transform: translate(73px,-1px) rotate(36deg)
	}

	40% {
		transform: translate(141px,72px) rotate(72deg)
	}

	60% {
		transform: translate(83px,122px) rotate(108deg)
	}

	80% {
		transform: translate(-40px,72px) rotate(144deg)
	}

	to {
		transform: translate(0) rotate(0deg)
	}
}

@-webkit-keyframes animationFramesOne {
	0% {
		-webkit-transform: translate(0) rotate(0deg)
	}

	20% {
		-webkit-transform: translate(73px,-1px) rotate(36deg)
	}

	40% {
		-webkit-transform: translate(141px,72px) rotate(72deg)
	}

	60% {
		-webkit-transform: translate(83px,122px) rotate(108deg)
	}

	80% {
		-webkit-transform: translate(-40px,72px) rotate(144deg)
	}

	to {
		-webkit-transform: translate(0) rotate(0deg)
	}
}

@keyframes animationFramesTwo {
	0% {
		transform: translate(0) rotate(0deg) scale(1)
	}

	20% {
		transform: translate(73px,-1px) rotate(36deg) scale(.9)
	}

	40% {
		transform: translate(141px,72px) rotate(72deg) scale(1)
	}

	60% {
		transform: translate(83px,122px) rotate(108deg) scale(1.2)
	}

	80% {
		transform: translate(-40px,72px) rotate(144deg) scale(1.1)
	}

	to {
		transform: translate(0) rotate(0deg) scale(1)
	}
}

@-webkit-keyframes animationFramesTwo {
	0% {
		-webkit-transform: translate(0) rotate(0deg) scale(1)
	}

	20% {
		-webkit-transform: translate(73px,-1px) rotate(36deg) scale(.9)
	}

	40% {
		-webkit-transform: translate(141px,72px) rotate(72deg) scale(1)
	}

	60% {
		-webkit-transform: translate(83px,122px) rotate(108deg) scale(1.2)
	}

	80% {
		-webkit-transform: translate(-40px,72px) rotate(144deg) scale(1.1)
	}

	to {
		-webkit-transform: translate(0) rotate(0deg) scale(1)
	}
}

@keyframes animationFramesThree {
	0% {
		transform: translate(165px,-179px)
	}

	to {
		transform: translate(-346px,617px)
	}
}

@-webkit-keyframes animationFramesThree {
	0% {
		-webkit-transform: translate(165px,-179px)
	}

	to {
		-webkit-transform: translate(-346px,617px)
	}
}

@keyframes animationFramesFour {
	0% {
		transform: translate(-300px,151px) rotate(0deg)
	}

	to {
		transform: translate(251px,-200px) rotate(180deg)
	}
}

@-webkit-keyframes animationFramesFour {
	0% {
		-webkit-transform: translate(-300px,151px) rotate(0deg)
	}

	to {
		-webkit-transform: translate(251px,-200px) rotate(180deg)
	}
}

@keyframes animationFramesFive {
	0% {
		transform: translate(61px,-99px) rotate(0deg)
	}

	21% {
		transform: translate(4px,-190px) rotate(38deg)
	}

	41% {
		transform: translate(-139px,-200px) rotate(74deg)
	}

	60% {
		transform: translate(-263px,-164px) rotate(108deg)
	}

	80% {
		transform: translate(-195px,-49px) rotate(144deg)
	}

	to {
		transform: translate(-1px) rotate(180deg)
	}
}

@-webkit-keyframes animationFramesFive {
	0% {
		-webkit-transform: translate(61px,-99px) rotate(0deg)
	}

	21% {
		-webkit-transform: translate(4px,-190px) rotate(38deg)
	}

	41% {
		-webkit-transform: translate(-139px,-200px) rotate(74deg)
	}

	60% {
		-webkit-transform: translate(-263px,-164px) rotate(108deg)
	}

	80% {
		-webkit-transform: translate(-195px,-49px) rotate(144deg)
	}

	to {
		-webkit-transform: translate(-1px) rotate(180deg)
	}
}

@keyframes gradientBG {
	0% {
		background-position: 0 0
	}

	50% {
		background-position: 300% 0
	}

	to {
		background-position: 0 0
	}
}

@-webkit-keyframes imageBgAnim {
	0% {
		background-position: 0 0
	}

	50% {
		background-position: 120% 0
	}

	to {
		background-position: 0 0
	}
}

@keyframes imageBgAnim {
	0% {
		background-position: 0 0
	}

	50% {
		background-position: 120% 0
	}

	to {
		background-position: 0 0
	}
}

@-webkit-keyframes gradientBG {
	0% {
		background-position: 0 0
	}

	50% {
		background-position: 120% 0
	}

	to {
		background-position: 0 0
	}
}

.i-con {
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	border: 2px solid transparent;
	border-radius: 2px;
	display: inline-block;
	vertical-align: -2px;
	margin: -2px 0;
	position: relative;
	transition: all .3s;
	width: 24px;
	height: 24px;
	background: 0 0;
	box-sizing: content-box
}

.i-con:after,.i-con:before,.i-con i:after,.i-con i:before,.i-con span:after,.i-con span:before {
	content: "";
	width: 0;
	height: 0;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	border-top-width: inherit;
	border-color: currentColor;
	border-top-style: solid;
	position: absolute;
	z-index: 2;
	box-sizing: border-box
}

.i-con i,.i-con span {
	width: 100%;
	height: 100%;
	margin: 0!important;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	border: inherit;
	border-radius: inherit;
	border-color: transparent;
	box-sizing: content-box;
	position: absolute;
	z-index: 3
}

.i-con-h-a .i-con:after,.i-con-h-a .i-con:before,.i-con-h-a .i-con i:after,.i-con-h-a .i-con i:before,.i-con-h-a .i-con span:after,.i-con-h-a .i-con span:before {
	transition: all .2s ease-in-out
}

.i-con-grid:after,.i-con-grid:before,.i-con-grid i:after,.i-con-grid i:before {
	width: 37.5%;
	height: 37.5%;
	left: 5%;
	top: 5%;
	border: inherit;
	border-color: currentColor;
	border-radius: 2px;
	transform: none
}

.i-con-grid:after {
	top: auto;
	bottom: 5%
}

.i-con-grid:after,.i-con-grid i:before {
	left: auto;
	right: 5%
}

.i-con-grid i:after {
	top: auto;
	bottom: 5%
}

.i-con-h-a:active .i-con-grid i:before,.i-con-h-a:hover .i-con-grid i:before {
	transform: rotate(135deg);
	transform-origin: center center
}

.i-con-grid.solid:after,.i-con-grid.solid:before {
	background-color: currentColor
}

.i-con-list:before,.i-con-list i:before {
	width: 37.5%;
	height: 37.5%;
	left: 5%;
	top: 5%;
	border: inherit;
	border-color: currentColor;
	border-radius: 2px;
	transform: translate(0)
}

.i-con-list:after,.i-con-list i:after {
	width: 37.5%;
	left: auto;
	right: 5%;
	top: 75%;
	transform: translateY(-50%)
}

.i-con-list i:before {
	top: auto;
	bottom: 5%
}

.i-con-list i:after {
	top: 25%
}

.i-con-h-a:active .i-con-list:before,.i-con-h-a:active .i-con-list i:before,.i-con-h-a:hover .i-con-list:before,.i-con-h-a:hover .i-con-list i:before {
	transform: rotate(135deg);
	transform-origin: center center
}

.i-con-list.solid:before {
	background-color: currentColor
}

.i-con-layer:after,.i-con-layer:before {
	width: 60%;
	height: 60%;
	top: 45%;
	border: inherit;
	border-color: currentColor;
	border-radius: 2px;
	transform: rotate(45deg) translate(-50%,-50%) skew(-10deg,-10deg);
	transform-origin: top left
}

.i-con-layer:after {
	top: 70%;
	border-color: transparent currentColor currentColor transparent;
	border-top-width: 0;
	border-left-width: 0;
	border-top-left-radius: 2px
}

.i-con-h-a:active .i-con-layer:before,.i-con-h-a:hover .i-con-layer:before {
	border-color: currentColor transparent transparent currentColor;
	border-right-width: 0;
	border-bottom-width: 0;
	border-radius: 2px 0 0 0
}

.i-con-h-a:active .i-con-layer:after,.i-con-h-a:hover .i-con-layer:after {
	border-color: currentColor;
	border-radius: 2px;
	border-top-width: inherit;
	border-left-width: inherit
}

.i-con-layer.solid:before {
	background-color: currentColor
}

.i-con-calendar:before {
	width: 100%;
	height: 87.5%;
	border: inherit;
	border-color: currentColor;
	border-radius: 2px
}

.i-con-calendar:after {
	width: 50%;
	height: 25%;
	top: 10%;
	border: inherit;
	border-color: currentColor;
	border-radius: 0;
	border-top-width: 0;
	border-bottom-width: 0
}

.i-con-calendar i:before {
	width: 0;
	top: 55%;
	left: 30%
}

.i-con-calendar i:after {
	width: 100%;
	height: 30%;
	top: 6.25%;
	border: inherit;
	border-color: transparent transparent currentColor;
	border-radius: 2px 2px 0 0;
	transform: translate(-50%)
}

.i-con-h-a:active .i-con-calendar i:before,.i-con-h-a:hover .i-con-calendar i:before {
	width: 30%;
	left: 50%
}

.i-con-calendar.solid i:after {
	background-color: currentColor
}

.i-con-layout:before {
	width: 95%;
	height: 93.5%;
	border: inherit;
	border-color: currentColor;
	border-radius: 2px
}

.i-con-layout:after {
	width: 0;
	height: 85%;
	left: 37.5%;
	top: auto;
	bottom: 6.5%;
	border-left: inherit;
	border-left-color: currentColor;
	transform: translate(0)
}

.i-con-layout i:before {
	top: 35%;
	width: 60%;
	left: 37.5%;
	transform: translateY(-50%)
}

.i-con-layout i:after {
	width: 0;
	height: 30%;
	top: 6.25%;
	border: inherit;
	border-color: transparent transparent currentColor;
	border-radius: 2px 2px 0 0;
	transform: translate(-50%);
	opacity: 0
}

.i-con-h-a:active .i-con-layout:after,.i-con-h-a:hover .i-con-layout:after {
	height: 55.5%
}

.i-con-h-a:active .i-con-layout i:before,.i-con-h-a:hover .i-con-layout i:before {
	width: 90%;
	left: 5%
}

.i-con-layout.solid i:before {
	width: 100%;
	left: 0
}

.i-con-layout.solid i:after {
	width: 100%;
	opacity: 1;
	background-color: currentColor
}

.macwk-sidebar {
	position: relative;
	display: flex;
	flex-direction: column;
	z-index: 997;
	width: 100%;
	text-align: left;
	transition: max-width .3s ease
}

.macwk-sidebar,.macwk-sidebar * {
	box-sizing: border-box
}

.macwk-sidebar .vsm--scroll-wrapper {
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden
}

.macwk-sidebar .vsm--item {
	position: relative;
	display: block;
	width: 100%;
	white-space: nowrap
}

.macwk-sidebar .vsm--link {
	cursor: pointer;
	position: relative;
	display: block;
	font-size: 15px;
	font-weight: 400;
	padding: 3px 0;
	line-height: 30px;
	text-decoration: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	z-index: 20;
	transition: transform .3s ease
}

.macwk-sidebar .vsm--link:hover {
	color: #50a1ff;
	transform: translateX(5px)
}

.macwk-sidebar .vsm--link_active {
	font-weight: 600;
	color: #50a1ff
}

.macwk-sidebar .vsm--link>* {
	vertical-align: middle
}

.macwk-sidebar .vsm--arrow {
	width: 30px;
	text-align: center;
	font-style: normal;
	font-weight: 900;
	position: absolute;
	right: 0;
	top: 54%;
	transform: translateY(-50%);
	transition: transform .3s ease
}

.macwk-sidebar .vsm--arrow:after {
	content: "\f105";
	font-family: Font Awesome\ 5 Free
}

.macwk-sidebar .vsm--arrow_slot:after {
	display: none
}

@-webkit-keyframes slide-animation {
	0% {
		width: 0
	}

	to {
		width: 100%
	}
}

@keyframes slide-animation {
	0% {
		width: 0
	}

	to {
		width: 100%
	}
}

.w-r {
	position: relative;
	box-sizing: border-box
}

.w-r:after,.w-r:before {
	display: table;
	content: ""
}

.w-r:after {
	clear: both
}

.w-r--flex {
	display: flex
}

.w-r--flex:after,.w-r--flex:before {
	display: none
}

.w-r--flex.is-align-middle {
	align-items: center
}[class*=w-c-] {
	float: left;
	box-sizing: border-box
}

.w-c-2 {
	width: 8.33333%
}

.w-c-4 {
	width: 16.66667%
}

.w-c-6 {
	width: 25%
}

.w-c-22 {
	width: 91.66667%
}

.el-pagination {
	height: 46px;
	margin-bottom: 20px;
	position: relative;
	color: inherit
}

.el-pagination button,.el-pagination li,.el-pagination span:not([class*=suffix]) {
	display: inline-block;
	font-size: 18px;
	min-width: 46px;
	height: 46px;
	line-height: 46px;
	vertical-align: middle
}

.el-pagination button {
	background-color: transparent
}

.el-pagination button:disabled {
	color: inherit;
	opacity: .3;
	background-color: transparent
}

.el-switch__label {
	color: #757575;
	font-weight: 400
}

.el-switch__label.is-active {
	color: #50a1ff
}

.el-image {
	overflow: unset
}

.el-popover {
	z-index: 9999!important
}

.shape-three {
	position: absolute;
	top: 21%;
	right: 22%;
	-webkit-animation: animationFramesTwo 13s linear infinite;
	animation: animationFramesTwo 13s linear infinite
}

.shape-four {
	position: absolute;
	top: 27%;
	left: 7%;
	-webkit-animation: animationFramesFour 25s linear infinite alternate;
	animation: animationFramesFour 25s linear infinite alternate
}

.shape-five {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-animation: animationFramesThree 35s linear infinite alternate;
	animation: animationFramesThree 35s linear infinite alternate
}

.shape-six {
	position: absolute;
	top: 70%;
	right: 3%;
	-webkit-animation: animationFramesFour 20s linear infinite alternate;
	animation: animationFramesFour 20s linear infinite alternate
}

.shape-seven {
	position: absolute;
	bottom: 2%;
	right: 28%;
	-webkit-animation: animationFramesOne 15s linear infinite;
	animation: animationFramesOne 15s linear infinite
}

.shape-eight {
	position: absolute;
	bottom: 3%;
	left: 38%;
	-webkit-animation: animationFramesFour 20s linear infinite alternate;
	animation: animationFramesFour 20s linear infinite alternate
}

.shape-nine {
	bottom: 4%;
	-webkit-animation: animationFramesOne 17s linear infinite;
	animation: animationFramesOne 17s linear infinite
}

.shape-nine,.shape-ten {
	position: absolute;
	left: 4%
}

.shape-ten {
	top: 60%;
	-webkit-animation: animationFramesOne 20s linear infinite alternate;
	animation: animationFramesOne 20s linear infinite alternate
}

.shape-eleven {
	top: 22%;
	left: 41%
}

.shape-10,.shape-eleven {
	position: absolute;
	-webkit-animation: animationFramesOne 15s linear infinite;
	animation: animationFramesOne 15s linear infinite
}

.shape-10 {
	top: 2%;
	right: 2%
}

.shape-11 {
	position: absolute;
	top: 6%;
	right: 4%;
	-webkit-animation: animationFramesOne 15s linear infinite;
	animation: animationFramesOne 15s linear infinite
}

.bg-shape-holder {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	overflow: hidden
}

.bg-shape-holder img {
	width: auto!important
}

.bg-shape-holder .shape-10 {
	top: -50px;
	right: auto;
	left: 2%;
	z-index: 4;
	opacity: .5
}

.bg-shape-holder .shape-11 {
	position: absolute;
	top: 100px;
	right: auto;
	left: 4%;
	z-index: 4;
	opacity: .5
}

.bg-shape-holder .big-round-one {
	position: absolute;
	width: 400px;
	height: 400px;
	background: #fbfdff;
	top: -200px;
	left: -100px;
	border-radius: 50%;
	z-index: 3
}

.bg-shape-holder .big-round-two {
	position: absolute;
	width: 1000px;
	height: 1000px;
	background: #fff;
	top: -500px;
	left: -400px;
	border-radius: 50%;
	z-index: 2
}

.bg-shape-holder .big-round-three {
	position: absolute;
	width: 1300px;
	height: 1300px;
	background: #fbfdff;
	top: -700px;
	left: -600px;
	border-radius: 50%;
	z-index: 1
}

.bg-shape-holder .shape-three {
	position: absolute;
	bottom: 15%;
	left: 35%;
	-webkit-animation: animationFramesFour 15s linear infinite alternate;
	animation: animationFramesFour 15s linear infinite alternate
}

.bg-shape-holder .shape-four {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: rgba(213,238,255,.29);
	position: absolute;
	bottom: 12%;
	right: 30%;
	-webkit-animation: animationFramesFive 15s linear infinite alternate;
	animation: animationFramesFive 15s linear infinite alternate
}

@-webkit-keyframes ball-scale-multiple {
	0% {
		transform: scale(0);
		opacity: 0
	}

	5% {
		opacity: 1
	}

	to {
		transform: scale(1);
		opacity: 0
	}
}

@keyframes ball-scale-multiple {
	0% {
		transform: scale(0);
		opacity: 0
	}

	5% {
		opacity: 1
	}

	to {
		transform: scale(1);
		opacity: 0
	}
}

body {
	font-weight: 400;
	color: #757575;
	background-color: #F3F5F7
}

a:not([href]) {
	color: inherit;
	text-decoration: none
}

a:not([href]):hover {
	color: #50a1ff;
	text-decoration: none
}

a {
	color: inherit;
	text-decoration: none;
	cursor: pointer;
	outline: 0
}

a.active,a:active,a:focus,a:hover {
	color: #50a1ff;
	text-decoration: none;
	outline: none
}

button,input,textarea {
	color: inherit
}

b {
	font-weight: 600
}

.label {
	display: block;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 2px
}

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
	color: inherit;
	letter-spacing: .5px
}

.h1 small,.h2 small,.h3 small,.h4 small,.h5 small,.h6 small,h1 small,h2 small,h3 small,h4 small,h5 small,h6 small {
	font-size: 65%;
	color: #929daf
}

.h1 b,.h2 b,.h3 b,.h4 b,.h5 b,.h6 b,h1 b,h2 b,h3 b,h4 b,h5 b,h6 b {
	font-weight: 500
}

.h1 a,.h2 a,.h3 a,.h4 a,.h5 a,.h6 a,h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {
	color: inherit
}

.h1 a:hover,.h2 a:hover,.h3 a:hover,.h4 a:hover,.h5 a:hover,.h6 a:hover,h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover {
	color: #50a1ff
}

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
	font-weight: 400
}

.h6,h6 {
	letter-spacing: .75px
}

.h6.bold,h6.bold {
	text-transform: uppercase;
	font-weight: 700;
	font-size: .75rem;
	letter-spacing: .5px
}

.h6.bold:before,h6.bold:before {
	content: "\2014 \00A0"
}

.text-muted {
	color: inherit!important;
	opacity: .7
}

.blockquote {
	margin-bottom: 1rem;
	color: #979b9e
}

.blockquote:before {
	content: "“";
	display: inline-block;
	font-size: 4rem;
	line-height: .2;
	font-weight: 600;
	padding-top: 0;
	vertical-align: -30px;
	opacity: .1
}

.blockquote p:after,.blockquote p:before {
	font-size: 1.5rem;
	line-height: 1;
	opacity: .5
}

.blockquote p:before {
	content: "“";
	margin-left: -13px;
	padding-right: 4px
}

.blockquote p:after {
	content: "”";
	margin-right: -13px;
	padding-left: 4px
}

::selection {
	background: #74b4ff;
	color: #fff
}

::-moz-selection {
	background: #74b4ff;
	color: #fff
}

img {
	max-width: 100%;
	height: auto
}

.avatar {
	position: relative;
	line-height: 1;
	white-space: nowrap;
	font-weight: 700;
	border-radius: 500px;
	border-radius: 100%;
	display: flex;
	justify-content: center;
	align-items: center
}

.avatar img {
	border-radius: 0px;
	width: 100%
}

.macwk-card {
	width: 100%;
	border-radius: 5px;
	display: block;
	position: relative;
	transition: all .3s ease-in-out
}

.macwk-card .macwk-card__collapsible-content {
	transition: all .3s ease-in-out
}

.macwk-card .macwk-card__collapsible-content.vs-con-loading__container {
	overflow: unset
}

.macwk-card .macwk-card__collapsible-content .macwk-card__body {
	padding: 1rem
}

.macwk-card .macwk-card__collapsible-content img {
	display: block
}

.snow-dot {
	position: absolute;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: rgba(194,215,255,.5);
	z-index: -1;
	display: none
}

.snow-dot:first-child {
	top: 25px;
	left: 41%;
	z-index: 1;
	-webkit-animation: scale-upOne 1s ease-in infinite alternate;
	animation: scale-upOne 1s ease-in infinite alternate
}

.snow-dot:nth-child(2) {
	top: 25px;
	left: 78%;
	-webkit-animation: scale-upOne 1.1s ease-in infinite alternate;
	animation: scale-upOne 1.1s ease-in infinite alternate
}

.snow-dot:nth-child(3) {
	top: 75px;
	left: 61%;
	-webkit-animation: scale-upOne .8s ease-in infinite alternate;
	animation: scale-upOne .8s ease-in infinite alternate
}

.snow-dot:nth-child(4) {
	top: 136px;
	left: 84%;
	-webkit-animation: scale-upOne 1s ease-in infinite alternate;
	animation: scale-upOne 1s ease-in infinite alternate
}

.snow-dot:nth-child(5) {
	bottom: 35px;
	right: 12%;
	-webkit-animation: scale-upOne 1.2s ease-in infinite alternate;
	animation: scale-upOne 1.2s ease-in infinite alternate
}

.snow-dot:nth-child(6) {
	bottom: 80px;
	right: 31%;
	-webkit-animation: scale-upOne .9s ease-in infinite alternate;
	animation: scale-upOne .9s ease-in infinite alternate
}

.snow-dot:nth-child(7) {
	bottom: 40px;
	right: 51%;
	-webkit-animation: scale-upOne 1s ease-in infinite alternate;
	animation: scale-upOne 1s ease-in infinite alternate
}

.macwk-app {
	position: relative;
	width: 100%;
	border-radius: 7px;
	padding: 0px 0px 12px;
	display: block;
	overflow: hidden;
	margin-bottom: 20px;
	transition: transform .3s ease-in-out,translateY .3s ease-in-out,box-shadow .3s ease-in-out
}

.macwk-app__hover--content {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 600px;
	height: 600px;
	background: linear-gradient(130deg,transparent,transparent 50%,rgba(194,215,255,.3));
	border-radius: 50%;
	z-index: -1;
	opacity: 0;
	transform: translate(-30%,-40%)
}

.macwk-app__header--icon {
	position: relative
}

.macwk-app__header--icon img {
	width: 72px;
	height: 72px;
	position: relative;
	z-index: 1;
	transition: transform .3s ease-in-out,translateY .3s ease-in-out
}

.macwk-app__header--icon--content {
	--size: 92px;
	width: var(--size);
	height: var(--size);
	position: absolute;
	top: -10px;
	left: -10px;
	background-image: var(--img);
	border-radius: 55px;
	opacity: .6;
	transform: scale(0) translateX(-50%);
	filter: blur(20px) opacity(70%);
	z-index: -1;
	transition-delay: .05s;
	transition: transform .3s ease-in-out
}

.macwk-app__header--icon--content {
	background-color: var(--color);
	background-size: cover;
	background-repeat: no-repeat
}

.macwk-app__body {
	padding: 25px 5px 35px
}

.macwk-app__body--title {
	margin-bottom: .25rem;
	font-weight: 400
}

.macwk-app__body--title--version {
	display: none
}

.macwk-app__body--info {
	margin-bottom: 0;
	font-size: 15px;
	opacity: .5
}

.macwk-app__extend {
	padding: 3px;
	display: flex;
	flex: 1
}

.macwk-app__extend>div i {
	opacity: .3;
	margin-right: 5px
}

.macwk-app__extend>div span {
	opacity: .7
}

.macwk-app__extend--download {
	width: 70px
}

.macwk-app__extend--comment {
	flex: 1
}

.macwk-app__extend--like,.macwk-app__extend--os {
	display: none
}

.macwk-app__footer--more {
	margin-left: 10px;
	font-size: 36px;
	line-height: 1
}

.macwk-app.active,.macwk-app:hover {
	transform: translateY(-5px);
	box-shadow: 0 4px 8px rgba(84,81,81,.15);
	z-index: 1
}

.macwk-app.active .snow-dot,.macwk-app:hover .snow-dot {
	display: inline-block;
	transition: display .3s ease-in-out
}

.macwk-app.active .macwk-app__hover--content,.macwk-app:hover .macwk-app__hover--content {
	opacity: 1;
	transition: transform .9s ease-in-out,opacity .9s ease-in-out
}

.macwk-app.active .macwk-app__body--title,.macwk-app.active .macwk-app__footer--more .light-icon-more,.macwk-app:hover .macwk-app__body--title,.macwk-app:hover .macwk-app__footer--more .light-icon-more {
	color: #50a1ff
}

.macwk-app:hover .macwk-app__header--icon img {
	transform: scale(1.1)
}

.macwk-app:hover .macwk-app__header--icon--content {
	transform: scale(1)
}

.macwk-app.active .macwk-app__header--icon img {
	transform: scale(1.1)
}

.grid-list .macwk-app {
	display: flex;
	align-content: center;
	border-radius: 0;
	margin-bottom: -2px;
	align-items: center;
	border-width: 0!important;
	background-color: transparent;
	background-image: linear-gradient(#fff,hsla(0,0%,100%,.7));
	box-shadow: 0 0 3px rgba(0,0,0,.06)
}

.grid-list .macwk-app__hover--content {
	background: linear-gradient(130deg,hsla(0,0%,100%,0),rgba(194,215,255,.1) 50%,hsla(0,0%,100%,0));
	border-radius: 50%;
	transform: translate(-30%,-40%)
}

.grid-list .macwk-app__body {
	padding: 0;
	flex: 1
}

.grid-list .macwk-app__body--title {
	margin-bottom: 0
}

.grid-list .macwk-app__body--info {
	margin-bottom: 0;
	opacity: .5
}

.grid-list .macwk-app.active,.grid-list .macwk-app:hover {
	transform: translateY(-1px);
	background-color: transparent;
	border-top-style: solid!important;
	background-image: linear-gradient(#fff,hsla(0,0%,100%,.5) 30%,#fff);
	box-shadow: 0 0 26px rgba(0,61,131,.1)
}

.grid-list .macwk-app.active .macwk-app__hover--content,.grid-list .macwk-app:hover .macwk-app__hover--content {
	transition: transform .9s ease-in-out,opacity .9s ease-in-out
}

.grid-list .macwk-app {
	padding: 15px 25px 16px
}

.grid-list .macwk-app__hover--content {
	width: 1393px;
	height: 1000px
}

.grid-list .macwk-app__header--icon {
	max-width: 50px;
	margin-right: 25px
}

.grid-list .macwk-app__header--icon img {
	width: 50px;
	height: 50px
}

.grid-list .macwk-app__header--icon--content {
	top: -10px;
	left: -10px;
	width: 70px;
	height: 70px
}

.grid-list .macwk-app__body--title {
	font-size: 18px
}

.grid-list .macwk-app__body--title--version {
	display: inline-block
}

.grid-list .macwk-app__body--info {
	font-size: 15px
}

.grid-list .macwk-app__footer {
	display: inline-block
}

.grid-list .macwk-app__extend--download {
	width: 100px
}

.grid-list .macwk-app__extend--comment {
	flex: none;
	width: 80px
}

.grid-list .macwk-app__extend--like {
	width: 80px
}

.grid-list .macwk-app__extend--os {
	display: inline-block;
	width: 100px
}

.grid-list .macwk-app__extend--update {
	width: 70px
}

.macwk-animation .macwk-app__header--icon img {
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: vanishInSmall;
	animation-name: vanishInSmall
}

pre {
	background-color: #fafcfd;
	padding: 12px;
	border: 1px solid hsla(210,8%,51%,.065);
	border-left: 3px solid #50a1ff;
	box-shadow: 0 0 15px rgba(0,0,0,.02)
}

.van-dialog .van-button {
	flex: 1;
	height: 60px;
	display: block
}

.van-dialog .van-hairline--left {
	border-left: 1px solid hsla(210,8%,51%,.09)
}

.van-dialog__footer {
	display: flex;
	border-top: 1px solid hsla(210,8%,51%,.09)!important
}

.van-dialog__header {
	font-size: 26px;
	line-height: 30px;
	color: #111a34;
	font-weight: 400;
	padding-top: 45px
}

.van-dialog__confirm {
	color: #50a1ff!important;
	font-weight: 600;
	font-size: 20px
}

.van-dialog .van-button--default {
	background-color: transparent
}[class*=van-hairline]:after {
	display: none
}

@-webkit-keyframes loading {
	0% {
		bottom: -80%
	}

	to {
		bottom: 5%
	}
}

@keyframes loading {
	0% {
		bottom: -80%
	}

	to {
		bottom: 5%
	}
}

.click {
	display: block;
	position: absolute;
	left: 0;
	top: -16%;
	font-size: 30px;
	opacity: 0;
	color: grey
}

@-webkit-keyframes flashing {
	0% {
		opacity: 1
	}

	50% {
		opacity: 0
	}

	75% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

@keyframes flashing {
	0% {
		opacity: 1
	}

	50% {
		opacity: 0
	}

	75% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

@-webkit-keyframes tmr__inside {
	0% {
		stroke-dashoffset: 100px
	}

	to {
		stroke-dashoffset: 0px
	}
}

@keyframes tmr__inside {
	0% {
		stroke-dashoffset: 100px
	}

	to {
		stroke-dashoffset: 0px
	}
}

@-webkit-keyframes tmr_right {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@keyframes tmr_right {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@-webkit-keyframes tmr_top {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@keyframes tmr_top {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@-webkit-keyframes animPink_2 {
	0% {
		stroke-dashoffset: 9000px
	}

	to {
		stroke-dashoffset: 0px
	}
}

@keyframes animPink_2 {
	0% {
		stroke-dashoffset: 9000px
	}

	to {
		stroke-dashoffset: 0px
	}
}

@-webkit-keyframes tmr__notifi {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@keyframes tmr__notifi {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@-webkit-keyframes tmr_bottom {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@keyframes tmr_bottom {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@-webkit-keyframes tmr_modal {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@keyframes tmr_modal {
	0% {
		stroke-dashoffset: 0px
	}

	to {
		stroke-dashoffset: 40px
	}
}

@-webkit-keyframes tmr_big {
	0% {
		stroke-dashoffset: 190px
	}

	to {
		stroke-dashoffset: 0px
	}
}

@keyframes tmr_big {
	0% {
		stroke-dashoffset: 190px
	}

	to {
		stroke-dashoffset: 0px
	}
}

.featured-posts {
	display: flex
}

.featured-posts>div:first-of-type {
	display: flex;
	margin-right: 20px
}

.featured-posts>div:first-of-type .post-item {
	align-items: flex-end;
	padding-bottom: 28px;
	position: relative
}

.post-item {
	align-items: flex-end;
	padding-bottom: 28px;
	position: relative
}

.featured-posts>div:first-of-type .post-item h3 {
	font-size: 55px;
	margin-bottom: 30px;
	max-height: 210px;
	text-overflow: ellipsis;
	line-height: 1.3;
	white-space: normal;
	overflow: hidden;
	width: 100%;
	height: auto;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	-webkit-line-clamp: 3
}

.featured-posts>div:first-of-type .post-item h3+p.description {
	margin-top: -20px;
	margin-bottom: 30px
}

@media (min-width:781px) {
	.featured-posts>div:first-of-type .post-item .CS {
		position: absolute;
		top: 20px;
		right: 20px
	}
}

.featured-posts>div:first-of-type .post-item__content,.featured-posts>div:first-of-type .post-meta {
	max-width: 100%
}

.featured-posts>div:first-of-type .post-meta__info {
	display: block;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap
}

.featured-posts>div {
	width: calc(50% - 10px)
}

.featured-posts>div .post-item {
	width: 100%
}

.featured-posts>div:nth-of-type(2) .post-item h3 {
	text-overflow: ellipsis;
	line-height: 1.3;
	white-space: normal;
	overflow: hidden;
	width: 100%;
	height: auto;
	max-height: 100px;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	-webkit-line-clamp: 2
}

.featured-posts>div:nth-of-type(2) .post-item__content {
	max-width: calc(100% - 81px)
}

@media (min-width:781px) {
	.featured-posts .CS button {
		color: #fff
	}
}

.post-item {
	border-radius: 20px;
	display: flex;
	align-items: center;
	padding: 20px;
	margin-bottom: 20px;
	cursor: pointer;
	transition: all .2s ease-in-out;
	text-decoration: none;
	box-shadow: 0 20px 30px hsla(0,0%,45.5%,.02)
}

.post-item:visited h3,.post-item h3 {
	color: #292f3f
}

.post-item:hover {
	transform: scale(1.015);
	box-shadow: 0 20px 30px hsla(0,0%,45.5%,.15)
}

.post-item.active {
	transform: scale(1.05);
	box-shadow: 0 60px 70px hsla(0,0%,45.5%,.3)
}

.post-item__preview {
	width: 240px;
	height: 160px;
	border-radius: 10px;
	background-size: cover;
	background-position: 50%
}

.post-item__content {
	margin-left: 30px;
	flex: 1
}

.post-item__content h3 {
	font-size: 24px;
	line-height: 33px;
	font-weight: 500;
	margin: 0;
	font-family: CircularStd-Medium,helvetica,sans-serif;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	-webkit-line-clamp: 2
}

.post-item__content p.description {
	color: #707580;
	font-size: 19px;
	margin-top: 8px
}

.post-item--featured {
	background-size: cover;
	background-repeat: no-repeat;
	padding: 20px
}

.post-item--featured .post-item__content {
	margin: 0
}

.post-item--featured .post-item__content p.description {
	color: hsla(0,0%,100%,.9)
}

.post-item--featured,.post-item--featured .post-meta__info,.post-item--featured .post-meta__info h3,.post-item--featured:hover h3,.post-item--featured:visited,.post-item--featured:visited h3,.post-item--featured h3 {
	color: #fff!important
}

.post-meta {
	margin-top: 10px;
	display: flex;
	align-items: center;
	max-width: 100%
}

.post-meta .category {
	margin-right: 15px
}

.post-meta__avatars {
	margin-right: 15px;
	display: flex;
	align-items: center
}

.post-meta__avatars img {
	width: 30px;
	height: 30px;
	border-radius: 30px;
	border: 2px solid #fff
}

.post-meta__avatars img:nth-of-type(2) {
	margin-left: -10px
}

.post-meta__info {
	display: flex;
	align-items: center;
	color: #b3b7c1
}

.post-meta__info span:first-of-type {
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 140px;
	overflow: hidden
}

.post-meta__info span:nth-of-type(2) {
	margin: 0 10px
}

.category {
	font-family: CircularStd-Bold,helvetica,sans-serif;
	padding: 8px 12px;
	font-size: 12px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	background: #F82370;
	border-radius: 12px;
	display: inline-block;
	color: #fff
}

.category--tools {
	background: #9ba3bb
}

.CS {
	transition: all .4s ease
}

.CS {
	display: flex;
	flex-direction: column
}

.CS button {
	background: transparent;
	border: 0;
	cursor: pointer;
	transition: all .4s ease
}

.CS button.comment.active {
	color: #16c7ff
}

.CS button.share.active {
	color: #f31b83
}

.CS p {
	color: #292f3f;
	font-family: CircularStd-Bold,helvetica,sans-serif;
	margin: 0 auto;
	text-align: center;
	cursor: default
}

.CS button svg {
	display: flex;
	margin: 0 auto
}

.CS--lg {
	border-radius: 8px;
	max-width: 95px;
	padding: 8px
}

.CS--lg p {
	border-radius: 10px;
	margin-bottom: 8px;
	margin-top: 8px;
	padding: 12px 0;
	width: 65px
}

.CS--lg:hover,.CS--lg p {
	background: #f5f6f7
}

.CS--lg:hover button i {
	color: #fff!important
}

.CS--lg:hover button {
	background: #bcc1cc
}

.CS--lg:hover button.active.comment {
	background-color: #16c7ff
}

.CS--lg:hover button.active.share {
	background-color: #f31b83
}

.CS--lg:hover svg path {
	fill: #fff
}

.CS--lg button {
	border-radius: 8px;
	padding: 3px 0
}

.CS--lg button.comment:hover {
	background-color: #16c7ff
}

.CS--lg button.comment:hover i {
	color: #fff!important
}

.CS--lg button.share:hover {
	background-color: #f31b83
}

.CS--lg button.share:hover i {
	color: #fff!important
}

.article-comment-quote {
	position: relative;
	text-indent: 30px
}

.article-comment-quote:before {
	content: "";
	display: block;
	opacity: 1;
	position: absolute;
	left: 0;
	top: 0;
	width: 24px;
	height: 24px;
	background-image: url(../image/icon35.svg);
	background-repeat: no-repeat;
	background-position: 0;
	background-size: 90%
}

.post-meta .date {
	font-size: 14px;
	margin-right: 20px;
	display: inline-block
}

.post-meta .date {
	color: #9494af
}

.article-details .article-details-fg {
	position: relative;
	z-index: 1;
	width: 1000px;
	margin-left: auto;
	margin-right: auto
}

.article-banner {
	position: relative;
	border-radius: 2px;
	overflow: hidden;
	width: 960px;
	margin: 0 auto
}

.article-banner .imgBox {
	width: 960px;
	max-width: 960px;
	overflow: hidden
}

.article-content {
	font-family: Quicksand,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
	font-weight: 500;
	color: #2f495e
}

.article-content h1 {
	font-size: 2em;
	margin: .67em 0
}

.article-content pre {
	font-family: monospace,monospace;
	font-size: 1em
}

.article-content a {
	background-color: transparent
}

.article-content b {
	font-weight: bolder
}

.article-content code {
	font-family: monospace,monospace;
	font-size: 1em
}

.article-content small {
	font-size: 80%
}

.article-content img {
	border-style: none
}

.article-content button,.article-content input,.article-content select,.article-content textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0
}

.article-content button,.article-content input {
	overflow: visible
}

.article-content button,.article-content select {
	text-transform: none
}

.article-content [type=button],.article-content [type=reset],.article-content [type=submit],.article-content button {
	-webkit-appearance: button
}

.article-content [type=button]::-moz-focus-inner,.article-content [type=reset]::-moz-focus-inner,.article-content [type=submit]::-moz-focus-inner,.article-content button::-moz-focus-inner {
	border-style: none;
	padding: 0
}

.article-content [type=button]:-moz-focusring,.article-content [type=reset]:-moz-focusring,.article-content [type=submit]:-moz-focusring,.article-content button:-moz-focusring {
	outline: 1px dotted ButtonText
}

.article-content textarea {
	overflow: auto
}

.article-content [type=checkbox] {
	box-sizing: border-box;
	padding: 0
}

.article-content [type=search] {
	-webkit-appearance: textfield;
	outline-offset: -2px
}

.article-content [type=search]::-webkit-search-decoration {
	-webkit-appearance: none
}

.article-content ::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit
}

.article-content blockquote,.article-content h1,.article-content h2,.article-content h3,.article-content h4,.article-content h5,.article-content h6,.article-content p,.article-content pre {
	margin: 0
}

.article-content ol,.article-content ul {
	margin: 0;
	padding: 0
}

.article-content ol,.article-content ul {
	list-style: none
}

.article-content img {
	border-style: solid
}

.article-content [role=button],.article-content button {
	cursor: pointer
}

.article-content h1,.article-content h2,.article-content h3,.article-content h4,.article-content h5,.article-content h6 {
	font-size: inherit;
	font-weight: 600
}

.article-content h1:not([class*=text-]):after,.article-content h1:not([class*=text-]):before,.article-content h2:not([class*=text-]):after,.article-content h2:not([class*=text-]):before,.article-content h3:not([class*=text-]):after,.article-content h3:not([class*=text-]):before,.article-content h4:not([class*=text-]):after,.article-content h4:not([class*=text-]):before,.article-content h5:not([class*=text-]):after,.article-content h5:not([class*=text-]):before,.article-content h6:not([class*=text-]):after,.article-content h6:not([class*=text-]):before {
	border: 0 solid #e2e8f0
}

.article-content a:not(.btn) {
	color: #50a1ff
}

.article-content a:not(.btn).active,.article-content a:not(.btn):active,.article-content a:not(.btn):hover,.article-content a:not(.btn):hover h1,.article-content a:not(.btn):hover h2,.article-content a:not(.btn):hover h3,.article-content a:not(.btn):hover h4,.article-content a:not(.btn):hover h5,.article-content a:not(.btn):hover h6 {
}

.article-content button,.article-content input,.article-content select,.article-content textarea {
	padding: 0;
	line-height: inherit;
	color: inherit
}

.article-content code,.article-content pre {
	font-family: Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace
}

.article-content img,.article-content object,.article-content svg {
	display: block;
	vertical-align: middle
}

.article-content img {
	max-width: 100%;
	height: auto;
	border: 0;
	border-radius: 5px
}

.article-content h1 {
	position: relative;
	font-size: 1.875rem;
	display: table;
	margin-bottom: 2rem
}

.article-content h1:after {
	content: " ";
	width: 80%;
	display: block;
	margin-top: .5rem;
	margin-bottom: .25rem;
	border-radius: .25rem
}

.article-content h2 {
	position: relative;
	font-size: 1.5rem;
	display: table;
	margin-top: 2rem;
	margin-bottom: 2rem
}

.article-content h2:after {
	content: " ";
	width: 80%;
	display: block;
	margin-top: .5rem;
	margin-bottom: .25rem;
	border-radius: .25rem
}

.article-content h2:not([class*=text-]):after,.article-content h2:not([class*=text-]):before {
	border-width: 2px;
	border-color: #50a1ff
}

.article-content h2 code {
	font-size: 1.25rem
}

.article-content h3 {
	color: #2f495e;
	position: relative;
	font-size: 1.25rem;
	display: table;
	margin-top: 2rem;
	margin-bottom: 2rem
}

.article-content h3:after {
	content: " ";
	width: 80%;
	display: block;
	margin-top: .5rem;
	margin-bottom: .25rem;
	border-radius: .25rem
}

.article-content h3:not([class*=text-]):after,.article-content h3:not([class*=text-]):before {
	border-width: 2px;
	border-color: #718096
}

.article-content h3 code {
	font-size: 1.125rem
}

.article-content h4,.article-content h5,.article-content h6 {
	margin-bottom: .5rem;
	margin-top: 1rem
}

.article-content p {
	line-height: 2;
	padding-top: .25rem;
	padding-bottom: .25rem;
	margin-bottom: .25rem
}

.article-content li p {
	display: inline-block
}

.article-content blockquote {
	font-style: italic;
	color: #979b9e;
	line-height: 2;
	margin-bottom: 2rem
}

.article-content code {
	color: #f56565;
	padding: .25rem;
	font-style: normal;
	border-radius: .25rem;
	font-size: .875rem
}

.article-content a code {
	color: #50a1ff
}

.article-content a code:hover {
	color: #1d86ff
}

.article-content b {
	font-weight: 700;
	color: #2f495e
}

.article-content img {
	display: block;
	margin: 25px auto
}

.article-content ol,.article-content ul {
	list-style-position: inside;
	padding-top: .25rem;
	padding-bottom: .25rem;
	padding-left: .25rem
}

.article-content ol li,.article-content ul li {
	padding-top: .5rem;
	padding-bottom: .5rem
}

.article-content ol ol,.article-content ol ul,.article-content ul ol,.article-content ul ul {
	padding-left: 1rem;
	padding-top: .25rem
}

.article-content ol {
	list-style-type: decimal
}

.article-content ul {
	list-style-type: disc
}

.article-content pre {
	position: relative;
	border-radius: 4px;
	padding: 0;
	background: #eff2f4;
	border: 0;
	margin-top: .5rem;
	margin-bottom: 1rem;
	overflow: unset
}

.article-content code,.article-content pre code {
	line-height: 1.75;
	color: #5b5d6b;
	padding: .7rem 1rem;
	display: block
}

.article-content pre code {
	overflow-x: auto
}

.article-content pre:after {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .875rem;
	color: #fff;
	position: absolute;
	text-transform: uppercase;
	font-weight: 700;
	padding: 0 .5rem;
	z-index: 10;
	line-height: 2;
	border-radius: .25rem;
	top: -10px;
	right: -6px
}

.article-content h1 code,.article-content h2 code,.article-content h3 code,.article-content h4 code,.article-content h5 code,.article-content h6 code,.article-content li code,.article-content p code,.article-content span code,.article-content td code {
	padding: .1em .2rem;
	color: #f56565;
	background-color: #f7fafc;
	border-radius: 3px;
	font-size: 13px;
	display: inline
}

.article-content td code {
	padding: .4em .6rem;
	font-size: 13px;
	display: inline-block
}

.article-global {
	position: relative;
	border-left: 0;
	margin: 0 auto;
	font-size: 16px;
	line-height: 2
}

.article-global p {
	margin: 0 0 20px;
	line-height: 30px
}

.article-global h5 {
	font-style: normal;
	font-weight: 600;
	font-size: 22px;
	margin-top: 50px;
	margin-bottom: 26px;
	line-height: 140%
}

.article-global ol,.article-global ul {
	list-style-position: inside;
	padding-top: .25rem;
	padding-bottom: .25rem;
	padding-left: 0
}

.article-global ol li,.article-global ul li {
	padding-top: .3rem;
	padding-bottom: .3rem;
	font-size: 15px
}

.article-global ol ol,.article-global ol ul,.article-global ul ol,.article-global ul ul {
	padding-left: 1rem;
	padding-top: .25rem
}

.article-global ol {
	list-style-type: decimal
}

.article-global ul {
	list-style-type: circle
}

@-webkit-keyframes ripple {
	to {
		transform: scaleX(1.3) scaleY(1.6);
		opacity: 0
	}
}

@keyframes ripple {
	to {
		transform: scaleX(1.3) scaleY(1.6);
		opacity: 0
	}
}

.nav {
	display: flex;
	flex-wrap: wrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none
}

.nav-link {
	display: block;
	padding: .5rem 1rem
}

.nav-link:focus,.nav-link:hover {
	text-decoration: none
}

.nav-link.disabled {
	color: #a5b3c7;
	pointer-events: none;
	cursor: default
}

button {
	border: none;
	background-color: transparent
}

.btn,button {
	outline: none
}

.btn {
	letter-spacing: 1.7px;
	text-transform: uppercase;
	border-radius: 2px;
	transition: .15s linear
}

button:focus {
	outline: none
}

.btn-sm {
	padding: 8px 20px 6px;
	font-size: 11px
}

.btn-round {
	border-radius: 10rem
}

@-webkit-keyframes scrollDown1 {
	0% {
		transform: rotate(-45deg) translate(0)
	}

	20% {
		transform: rotate(-45deg) translate(-16px,16px)
	}

	40% {
		transform: rotate(-45deg) translate(0)
	}
}

@keyframes scrollDown1 {
	0% {
		transform: rotate(-45deg) translate(0)
	}

	20% {
		transform: rotate(-45deg) translate(-16px,16px)
	}

	40% {
		transform: rotate(-45deg) translate(0)
	}
}

@-webkit-keyframes scrollDown2 {
	0% {
		transform: rotate(-45deg) translate(0);
		opacity: 0
	}

	50% {
		opacity: 1
	}

	to {
		transform: rotate(-45deg) translate(-20px,20px);
		opacity: 0
	}
}

@keyframes scrollDown2 {
	0% {
		transform: rotate(-45deg) translate(0);
		opacity: 0
	}

	50% {
		opacity: 1
	}

	to {
		transform: rotate(-45deg) translate(-20px,20px);
		opacity: 0
	}
}

@-webkit-keyframes scrollDown3 {
	0% {
		opacity: 0
	}

	50% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

@keyframes scrollDown3 {
	0% {
		opacity: 0
	}

	50% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

@-webkit-keyframes scrollDown5 {
	0% {
		transform: translate(0);
		opacity: 0
	}

	40% {
		opacity: 1
	}

	80% {
		transform: translateY(20px);
		opacity: 0
	}

	to {
		opacity: 0
	}
}

@keyframes scrollDown5 {
	0% {
		transform: translate(0);
		opacity: 0
	}

	40% {
		opacity: 1
	}

	80% {
		transform: translateY(20px);
		opacity: 0
	}

	to {
		opacity: 0
	}
}

@-webkit-keyframes scrollDown5Smaller {
	0% {
		transform: translate(0);
		opacity: 0
	}

	40% {
		opacity: 1
	}

	80% {
		transform: translateY(10px);
		opacity: 0
	}

	to {
		opacity: 0
	}
}

@keyframes scrollDown5Smaller {
	0% {
		transform: translate(0);
		opacity: 0
	}

	40% {
		opacity: 1
	}

	80% {
		transform: translateY(10px);
		opacity: 0
	}

	to {
		opacity: 0
	}
}

.switch {
	position: relative;
	min-height: 1.9rem
}

.form-control,.form-control option {
	font-weight: 300
}

label {
	font-weight: 400;
	font-size: 13px;
	letter-spacing: .5px;
	margin-bottom: 4px
}

.input-group {
	border: 1px solid hsla(210,8%,51%,.09);
	border-radius: 2px;
	transition: all .3s ease-out
}

.input-group.focus {
	border-color: hsla(210,8%,51%,.065);
	box-shadow: 0 0 40px rgba(0,0,0,.045)
}

.input-group .form-control {
	box-shadow: none;
	border: none;
	border-radius: 0
}

.input-group-append {
	margin-left: 0;
	margin-right: 0
}

.input-group-append .btn {
	height: calc(100% + 2px);
	margin: -1px
}

.input-group-text {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 20px;
	background-color: #fff;
	border: none;
	color: #c9ccce;
	font-weight: 300;
	border-radius: 0;
	height: 100%
}

.input-group-text+.form-control {
	padding-left: 0
}

.input-group-text i {
	font-size: 20px
}

.input-group-text:not(:last-child),.input-group .form-control:not(:last-child) {
	border-right: 0
}

.input-group-text:not(:first-child),.input-group .form-control:not(:first-child) {
	border-left: 0
}

.input-group-append .btn {
	margin-left: 0
}

.our-special .img-box img {
	width: 100%
}

.special-standard .single-special-member {
	position: relative;
	padding: 0 45px 55px 0;
	margin-bottom: 100px
}

.special-standard .single-special-member .wrapper {
	position: relative
}

.special-standard .single-special-member .img-box img {
	border-radius: 4px
}

.special-standard .single-special-member .info-meta {
	position: absolute;
	width: 100%;
	right: 0;
	bottom: 0;
	transform: translate(45px,55px);
	padding: 20px 0 20px 40px;
	background: #fff;
	box-shadow: 5.994px 14.835px 30px 0 rgba(229,234,239,.5);
	transition: all .3s ease-in-out
}

.our-special .single-special-member .info-meta .name {
	font-size: 22px;
	margin-bottom: 0
}

.our-special .single-special-member .info-meta span {
	font-size: 16px
}

.special-standard .single-special-member:hover .info-meta {
	transform: translateY(55px)
}

.special-standard .single-special-member .hover-content {
	position: absolute;
	width: 45px;
	background: #fff;
	box-shadow: 8px 0 8.6px 1.4px rgba(229,234,239,.2);
	right: 0;
	top: 0;
	bottom: 0;
	transform: scaleX(0);
	transform-origin: 0 0;
	transition: all .3s ease-in-out
}

.special-standard .single-special-member .hover-content p {
	position: relative;
	top: 30%;
	transform: translateY(-50%);
	list-style: none;
	padding-left: 0
}

.special-standard .single-special-member .hover-content span {
	display: block;
	text-align: center;
	font-size: 20px;
	margin: 15px 0
}

.special-standard .single-special-member:hover .hover-content {
	transform: scale(1)
}

.macwk-emoji {
	width: 348px
}

.macwk-emoji .nav {
	border-bottom: 1px solid hsla(210,8%,51%,.09)
}

.macwk-emoji .nav .nav-link {
	border-bottom: 3px solid transparent;
	padding: 10px 5px;
	text-align: center;
	margin: 0 7px
}

.macwk-emoji .nav .nav-link svg {
	height: 20px
}

.macwk-emoji .nav .nav-link svg path {
	fill: #858585
}

.macwk-emoji .nav .nav-link:hover svg path {
	fill: #50a1ff
}

.macwk-emoji .nav .nav-link.active {
	border-bottom-color: #50a1ff
}

.macwk-emoji .nav .nav-link.active svg path {
	fill: #50a1ff
}

.macwk-emoji .emoji-container>span {
	display: inline-block;
	margin: 2px;
	width: 36px;
	height: 36px;
	line-height: 36px;
	text-align: center;
	font-size: 22px;
	cursor: pointer;
	transition: all .3s
}

.macwk-emoji .emoji-container>span:hover {
	transform: scale(1.3)
}

.macwk-emoji #viewBox {
	overflow: auto;
	height: 280px
}

.macwk-emoji #viewBox::-webkit-scrollbar {
	width: 0px;
	height: 0px
}

.macwk-emoji #viewBox::-webkit-scrollbar-thumb {
	border-radius: 8px;
	background: rgba(2,3,3,.09)
}

.macwk-emoji #viewBox::-webkit-scrollbar-track {
	background: hsla(210,8%,51%,.09)
}

.macwk-emoji .input-group {
	border-radius: 55px
}

.macwk-emoji .input-group .form-control {
	height: 32px;
	padding: .375rem 15px;
	font-size: .875rem;
	border-radius: 55px 0 0 55px
}

.macwk-emoji .input-group .input-group-append {
	background-color: transparent
}

.macwk-emoji .input-group .input-group-text {
	padding: .375rem 15px .375rem 0;
	border-radius: 0 55px 55px 0
}

.macwk-emoji .input-group .input-group-text i {
	font-size: 16px;
	color: #979b9e
}

.macwk-emoji .input-group .search-clear {
	position: absolute;
	right: 0;
	top: 0;
	font-size: 12px;
	font-weight: 700;
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	background: #fff;
	color: #979b9e;
	cursor: pointer;
	z-index: 9;
	border-radius: 0 55px 55px 0
}

.macwk-emoji .input-group .search-clear:hover {
	color: #50a1ff
}

.emoji-popover {
	padding: 0
}

@-webkit-keyframes AppInstallCursor {
	0% {
		transform-origin: 0 0;
		transform: translateX(0);
		background-image: url(https://cdn.macwk.com/public/uploads/_/originals/cursor-default.png)
	}

	60% {
		background-image: url(https://cdn.macwk.com/public/uploads/_/originals/cursor-default.png)
	}

	65% {
		background-image: url(https://cdn.macwk.com/public/uploads/_/originals/cursor-move.png)
	}

	to {
		transform: translateX(285px);
		background-image: url(https://cdn.macwk.com/public/uploads/_/originals/cursor-move.png)
	}
}

@keyframes AppInstallCursor {
	0% {
		transform-origin: 0 0;
		transform: translateX(0);
		background-image: url(https://cdn.macwk.com/public/uploads/_/originals/cursor-default.png)
	}

	60% {
		background-image: url(https://cdn.macwk.com/public/uploads/_/originals/cursor-default.png)
	}

	65% {
		background-image: url(https://cdn.macwk.com/public/uploads/_/originals/cursor-move.png)
	}

	to {
		transform: translateX(285px);
		background-image: url(https://cdn.macwk.com/public/uploads/_/originals/cursor-move.png)
	}
}

@-webkit-keyframes AppInstallIconBg {
	0% {
		background-color: transparent
	}

	30% {
		background-color: #f2f2f2
	}

	to {
		background-color: #f2f2f2
	}
}

@keyframes AppInstallIconBg {
	0% {
		background-color: transparent
	}

	30% {
		background-color: #f2f2f2
	}

	to {
		background-color: #f2f2f2
	}
}

@-webkit-keyframes AppInstallIconFolderBg {
	0%,40% {
		background-color: transparent
	}

	to {
		background-color: #f2f2f2
	}
}

@keyframes AppInstallIconFolderBg {
	0%,40% {
		background-color: transparent
	}

	to {
		background-color: #f2f2f2
	}
}

@-webkit-keyframes AppInstallIconTextBg {
	0% {
		background-color: transparent
	}

	30% {
		background-color: #1789ff;
		color: #fff
	}

	to {
		background-color: #1789ff;
		color: #fff
	}
}

@keyframes AppInstallIconTextBg {
	0% {
		background-color: transparent
	}

	30% {
		background-color: #1789ff;
		color: #fff
	}

	to {
		background-color: #1789ff;
		color: #fff
	}
}

@-webkit-keyframes AppInstallIconFolderTextBg {
	0% {
		background-color: transparent
	}

	40% {
		color: #3c4248;
		background-color: transparent
	}

	80% {
		color: #fff;
		background-color: #1789ff
	}

	to {
		background-color: #1789ff;
		color: #fff
	}
}

@keyframes AppInstallIconFolderTextBg {
	0% {
		background-color: transparent
	}

	40% {
		color: #3c4248;
		background-color: transparent
	}

	80% {
		color: #fff;
		background-color: #1789ff
	}

	to {
		background-color: #1789ff;
		color: #fff
	}
}

.list {
	padding-left: 0;
	padding-right: 0
}

.list-body {
	flex: 1
}

@-webkit-keyframes service_hexagon {
	0% {
		transform: rotate(0deg)
	}

	to {
		transform: rotate(1turn)
	}
}

@keyframes service_hexagon {
	0% {
		transform: rotate(0deg)
	}

	to {
		transform: rotate(1turn)
	}
}

#login-form button {
	text-transform: uppercase
}

.macwk-footer {
	width: 100%;
	border-top: 1px solid hsla(210,8%,51%,.09);
	height: 76px
}

.macwk-footer .logo {
	display: flex;
	align-items: center
}

.macwk-footer .logo img {
	width: 32px;
	margin-right: 15px
}

.macwk-footer .logo span {
	font-size: 24px;
	font-weight: 700;
	flex-grow: 1;
	color: #3c4248
}

.macwk-footer>.container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	height: inherit
}

#autosuggest {
	position: relative
}

#autosuggest .search-clear,#autosuggest .search-to {
	position: absolute;
	right: 38px;
	top: 1px;
	padding: 0;
	font-size: 12px;
	font-weight: 700;
	width: 38px;
	height: 38px;
	line-height: 36px;
	text-align: center;
	background: transparent;
	z-index: 9
}

#autosuggest .search-clear:hover,#autosuggest .search-to:hover {
	color: #50a1ff
}

#autosuggest .search-to {
	font-size: 16px;
	right: 8px
}

#autosuggest__input {
	outline: none;
	position: relative;
	display: block;
	border: 1px solid hsla(210,8%,51%,.09);
	padding: 5px 25px;
	width: 100%;
	border-radius: 500px;
	background-color: transparent;
	transition: all .3s ease-out
}

#autosuggest__input:focus {
	border-color: #50a1ff!important;
	box-shadow: 0 1px 5px rgba(80,161,255,.1)
}

#autosuggest__input::-moz-placeholder {
	color: inherit;
	opacity: .7
}

#autosuggest__input:-ms-input-placeholder {
	color: inherit;
	opacity: .7
}

#autosuggest__input::placeholder {
	color: inherit;
	opacity: .7
}

.autosuggest__results-container {
	width: 100%
}

.autosuggest__results {
	position: absolute;
	top: 55px;
	width: 100%;
	margin: 0;
	border: 1px solid hsla(210,8%,51%,.09);
	border-radius: 5px;
	background: #fff;
	max-height: 600px;
	z-index: 10000001;
	box-shadow: 0 0 18px rgba(0,0,0,.06)
}

.autosuggest__results:before {
	top: -11px;
	left: 26px;
	border-color: transparent transparent hsla(210,8%,51%,.09);
	border-width: 0 13.5px 12px
}

.autosuggest__results:after,.autosuggest__results:before {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid
}

.autosuggest__results:after {
	top: -10px;
	left: 25px;
	border-color: transparent transparent #fff;
	border-width: 0 14.5px 12.5px
}

.autosuggest__results .macwk-app {
	padding: 10px 20px 11px;
	-webkit-animation-name: none!important;
	animation-name: none!important;
	border-left: 0!important
}

.autosuggest__results .macwk-app__header--icon {
	margin-right: 15px
}

.autosuggest__results .macwk-app__header--icon img {
	width: 40px;
	height: 40px;
	-webkit-animation-name: none!important;
	animation-name: none!important
}

.autosuggest__results .macwk-app__header--icon--content {
	width: 60px;
	height: 60px
}

.autosuggest__results .macwk-app:hover {
	border-left: 0!important
}

.autosuggest__results ul {
	list-style: none;
	padding-left: 0;
	margin: 0;
	background: #F3F5F7
}

.app-content-header {
	position: relative;
	display: flex;
	align-items: center;
	z-index: 1
}

.app-content-header .main-title {
	margin-right: 2rem
}

.app-content-header .main-title h4,.app-content-header .main-title h5 {
	margin-bottom: 0
}

.app-content-header .main-title p {
	font-size: 18px;
	padding-top: 10px;
	margin-bottom: 0
}

.app-content-header .nav-title {
	position: relative
}

.app-content-header .nav-title a,.app-content-header .nav-title button {
	font-size: 15px;
	line-height: 30px;
	padding: 0 15px;
	text-align: center;
	transition: all .3s;
	opacity: .8
}

.app-content-header .nav-title a:last-child,.app-content-header .nav-title button:last-child {
	padding-right: 0
}

.app-content-header .nav-title a.active,.app-content-header .nav-title a:active,.app-content-header .nav-title a:focus,.app-content-header .nav-title a:hover,.app-content-header .nav-title button.active,.app-content-header .nav-title button:active,.app-content-header .nav-title button:focus,.app-content-header .nav-title button:hover {
	opacity: 1
}

.app-content-header .more-action {
	display: flex;
	min-width: 120px;
	justify-content: flex-end
}

.app-content-header .more-action .btn-more {
	line-height: 30px;
	text-align: right;
	border-radius: 4px;
	border: 1px solid transparent;
	font-size: 16px;
	font-weight: 400;
	padding: 0
}

.row.gap-a {
	margin: -10px
}

.row.gap-a>[class*=col-] {
	padding: 10px
}

.flex-grow {
	flex: 1
}

.flex-grow-1 {
	flex-grow: 1
}

.flex {
	flex: 1
}

html {
	height: 100%
}

body {
	width: 100%;
	min-height: 100vh;
	display: flex;
	flex-direction: column
}

.layout-min-full-height {
	min-height: calc(100vh - 178px)!important
}

::-webkit-scrollbar {
	width: 0px;
	height: 0px
}

::-webkit-scrollbar-thumb {
	border-radius: 8px
}

::-webkit-scrollbar-track {
	background: hsla(210,8%,51%,.09)
}

.app {
	width: 100%;
	display: flex;
	flex-direction: column
}

.app-header {
	position: relative;
	width: 100%
}

.app-header .app-header-navbar {
	position: relative;
	height: 60px;
	z-index: 999
}

.app-header .app-header-main {
	display: flex;
	align-items: center;
	height: inherit;
	margin: 0 auto
}

.app-header .app-header-main .app-header-logo {
	display: flex;
	align-items: center;
	width: 180px;
	min-width: 180px
}

.app-header .app-header-main .app-header-logo img,.app-header .app-header-main .app-header-logo svg {
	width: 32px;
	margin-right: 15px
}

.app-header .app-header-main .app-header-logo span {
	font-size: 24px;
	font-weight: 700;
	flex-grow: 1;
	color: #3c4248
}

.app-header .app-header-main .app-header-nav {
	flex: 1
}

.app-header .app-header-main .app-header-nav .nav-link {
	font-size: .9375rem;
	font-weight: 600;
	word-spacing: 2px;
	padding-left: 1.125rem;
	padding-right: 1.125rem;
	text-transform: uppercase;
	letter-spacing: 1px
}

.app-header .app-header-main .app-header-search {
	width: 360px;
	margin-right: 30px
}

.app-header .app-header-main .app-header-search .form-group {
	margin-bottom: 0;
	margin-top: 0;
	border-width: 0
}

.app-header .app-header-main .app-header-search .form-group .form-control {
	border-radius: 55px;
	padding-left: 20px;
	height: 40px;
	border: 1px solid hsla(210,8%,51%,.09)
}

.app-header .app-header-main .app-header-search .form-group .form-control:focus {
	border-color: #50a1ff!important;
	box-shadow: 0 1px 5px rgba(80,161,255,.1)
}

.app-header .app-header-main .app-header-search .form-group .input-group-append {
	position: absolute;
	right: 15px;
	top: 4px;
	z-index: 9
}

.app-header .app-header-main .app-header-search .form-group .input-group-append.reset {
	right: 55px;
	height: 36px;
	top: 2px
}

.app-header .app-header-main .app-header-search .form-group .input-group-append.reset i {
	font-size: 12px;
	font-weight: 700
}

.app-header .app-header-main .app-header-search .form-group .input-group-append button {
	border-radius: 0 55px 55px 0
}

.app-header .app-header-main .app-header-search .form-group .input-group-text {
	color: #979b9e;
	background-color: transparent;
	border: 0;
	border-radius: 0;
	padding-left: 10px
}

.app-header .app-header-main .app-header-search .form-group .i-con {
	border: 2px solid transparent;
	width: 20px;
	height: 20px
}

.app-header .app-header-main .app-header-search .btn:hover {
	color: #50a1ff
}

.app-header .app-header-main .app-header-user {
	width: 100px;
	display: flex;
	justify-content: flex-end
}

.app-sidebar {
	display: flex;
	flex-direction: column;
	width: 110px;
	margin-right: 25px
}

.app-main {
	display: flex;
	box-shadow: none;
	width: 100vw;
	margin: 0 auto;
	padding-top: 25px;
	padding-bottom: 25px
}

.app-content {
	flex-direction: column
}

.app-content,.app-content-main {
	flex: 1;
	display: flex
}

.app-content-main>div:last-child {
	flex-grow: 1;
	flex-direction: column
}

.app-content-main .app-content-list {
	display: flex;
	flex-direction: column;
	flex-grow: 1
}

.app-content-main .app-content-info {
	display: none
}

.app-content-main .app-content-header {
	padding: 0;
	margin-bottom: 20px;
	align-items: center
}

.app-content-main .app-content-body {
	padding-bottom: 2px
}

.app-content-main .app-content-bottom {
	padding: 0;
	align-items: center
}

.mw-row {
	display: flex;
	flex-wrap: wrap;
	margin-right: -10px;
	margin-left: -10px
}

.mw-col {
	position: relative;
	width: 20%;
	max-width: 20%;
	padding-right: 10px;
	padding-left: 10px;
	flex: 0 0 20%
}

.grid-list .mw-col {
	width: 100%;
	max-width: 100%;
	flex: 0 0 100%
}

.grid-list .app-content-info {
	display: flex;
	flex-grow: 0;
	width: 300px;
	min-width: 300px;
	max-width: 300px;
	margin-left: 30px
}

.layout-header .device-macbook-pro {
	transform: scale(.9)
}

@media (min-width:1260px) and (max-width:1499.98px) {

	.macwk-app__extend--os {
		display: none!important
	}

	.app-content-header .main-title {
		margin-right: 1rem
	}

	.grid-grid .mw-col {
		width: 25%;
		max-width: 25%;
		flex: 0 0 25%
	}

	.layout-header .device-macbook-pro {
		transform: scale(.75);
		margin-left: -60px
	}
}

@media (min-width:1260px) {
	.app-header-main,.app-main {
		width: 1170px
	}
}

@media (min-width:1500px) {
	.app-header-main,.app-main {
		width: 1410px
	}
}

.bt-1 {
	border-top: 1px solid hsla(210,8%,51%,.065)
}

.b-0 {
	border-width: 0!important
}

.circle {
	border-radius: 50%!important
}

img:not([src]) {
	opacity: 0
}

img {
	border-style: none
}

.bg-fixed {
	background-attachment: fixed
}

@media (max-width:640px) {
	.bg-fixed {
		background-attachment: scroll
	}
}

.app {
	min-height: 100vh
}

.opacity-40 {
	opacity: .4!important
}

.opacity-50 {
	opacity: .5!important
}

.opacity-70 {
	opacity: .7!important
}

.hover-opacity-normal.active,.hover-opacity-normal:active,.hover-opacity-normal:focus,.hover-opacity-normal:hover {
	opacity: 1!important
}

.shadow-2 {
	box-shadow: 0 0 8px rgba(0,0,0,.06)
}

.shadow-4 {
	box-shadow: 0 0 18px rgba(0,0,0,.06)
}

.hover-shadow-5:hover {
	box-shadow: 0 0 26px rgba(0,0,0,.06)
}

.hover-shadow-6:hover {
	box-shadow: 0 0 36px rgba(0,0,0,.06)
}

.no-shadow {
	box-shadow: none!important
}

.overflow-hidden {
	overflow: hidden
}

.transition {
	transition: .2s ease-out
}

.cursor,.cursor-pointer {
	cursor: pointer
}

.z-index-9999 {
	z-index: 9999
}

@-webkit-keyframes hue {
	0% {
		-webkit-filter: hue-rotate(0deg)
	}

	to {
		-webkit-filter: hue-rotate(-1turn)
	}
}

.w-20 {
	width: 20px!important;
	min-width: 20px!important
}

.h-20 {
	height: 20px!important
}

.w-28 {
	width: 28px!important;
	min-width: 28px!important
}

.w-32 {
	width: 32px!important;
	min-width: 32px!important
}

.w-50 {
	width: 50px!important;
	min-width: 50px!important
}

.h-50 {
	height: 50px!important
}

.mw-50 {
	max-width: 50px!important
}

.w-60 {
	width: 60px!important;
	min-width: 60px!important
}

.w-80 {
	width: 80px!important;
	min-width: 80px!important
}

.h-150 {
	height: 150px!important
}

.w-200 {
	width: 200px!important;
	min-width: 200px!important
}

.w-380 {
	width: 380px!important;
	min-width: 380px!important
}

.min-h-415 {
	min-height: 415px!important
}

.h-450 {
	height: 450px!important
}

.mh-500 {
	min-height: 500px!important
}

.w-600 {
	width: 600px!important;
	min-width: 600px!important
}

.fs-10 {
	font-size: 10px!important
}

.fs-12 {
	font-size: 12px!important
}

.fs-14 {
	font-size: 14px!important
}

.fs-16 {
	font-size: 16px!important
}

.fs-18 {
	font-size: 18px!important
}

.fs-20 {
	font-size: 20px!important
}

.fs-22 {
	font-size: 22px!important
}

.fs-24 {
	font-size: 24px!important
}

.fs-26 {
	font-size: 26px!important
}

.fs-36 {
	font-size: 36px!important
}

.fs-60 {
	font-size: 60px!important
}

.h-full {
	height: 100%!important
}

.w-full {
	width: 100%!important
}

.v-1 {
	vertical-align: 1px!important
}

.v-2 {
	vertical-align: 2px!important
}

.v-3 {
	vertical-align: 3px!important
}

.v-m-3 {
	vertical-align: -3px!important
}

.v-m-4 {
	vertical-align: -4px!important
}

.m-0 {
	margin: 0!important
}

.mt-0 {
	margin-top: 0!important
}

.mb-0 {
	margin-bottom: 0!important
}

.mr-1,.mx-1 {
	margin-right: .25rem!important
}

.mb-1 {
	margin-bottom: .25rem!important
}

.ml-1,.mx-1 {
	margin-left: .25rem!important
}

.mx-2 {
	margin-right: .5rem!important
}

.mb-2 {
	margin-bottom: .5rem!important
}

.ml-2,.mx-2 {
	margin-left: .5rem!important
}

.mr-3 {
	margin-right: .75rem!important
}

.mb-3 {
	margin-bottom: .75rem!important
}

.mt-4,.my-4 {
	margin-top: 1rem!important
}

.mr-4 {
	margin-right: 1rem!important
}

.mb-4,.my-4 {
	margin-bottom: 1rem!important
}

.ml-4 {
	margin-left: 1rem!important
}

.mt-5 {
	margin-top: 1.5rem!important
}

.mb-5 {
	margin-bottom: 1.5rem!important
}

.ml-5 {
	margin-left: 1.5rem!important
}

.mt-6,.my-6 {
	margin-top: 2rem!important
}

.mr-6 {
	margin-right: 2rem!important
}

.mb-6,.my-6 {
	margin-bottom: 2rem!important
}

.ml-6 {
	margin-left: 2rem!important
}

.mb-8 {
	margin-bottom: 5rem!important
}

.mt-10 {
	margin-top: 9rem!important
}

.p-0 {
	padding: 0!important
}

.py-0 {
	padding-top: 0!important
}

.pb-0,.py-0 {
	padding-bottom: 0!important
}

.pt-1,.py-1 {
	padding-top: .25rem!important
}

.py-1 {
	padding-bottom: .25rem!important
}

.pl-1 {
	padding-left: .25rem!important
}

.p-2 {
	padding: .5rem!important
}

.py-2 {
	padding-top: .5rem!important
}

.pb-2,.py-2 {
	padding-bottom: .5rem!important
}

.pl-2 {
	padding-left: .5rem!important
}

.py-3 {
	padding-top: .75rem!important
}

.pr-3,.px-3 {
	padding-right: .75rem!important
}

.py-3 {
	padding-bottom: .75rem!important
}

.pl-3,.px-3 {
	padding-left: .75rem!important
}

.p-4 {
	padding: 1rem!important
}

.pt-4 {
	padding-top: 1rem!important
}

.pt-5,.py-5 {
	padding-top: 1.5rem!important
}

.px-5 {
	padding-right: 1.5rem!important
}

.pb-5,.py-5 {
	padding-bottom: 1.5rem!important
}

.px-5 {
	padding-left: 1.5rem!important
}

.pt-6,.py-6 {
	padding-top: 2rem!important
}

.px-6 {
	padding-right: 2rem!important
}

.py-6 {
	padding-bottom: 2rem!important
}

.px-6 {
	padding-left: 2rem!important
}

.pt-7,.py-7 {
	padding-top: 3rem!important
}

.pb-7,.py-7 {
	padding-bottom: 3rem!important
}

.pt-8,.py-8 {
	padding-top: 5rem!important
}

.pb-8,.py-8 {
	padding-bottom: 5rem!important
}

.px-10 {
	padding-right: 9rem!important
}

.pl-10,.px-10 {
	padding-left: 9rem!important
}

.fs-10 {
	font-size: 10px!important
}

.fs-12 {
	font-size: 12px!important
}

.fs-13 {
	font-size: 13px!important
}

.fs-14 {
	font-size: 14px!important
}

.fs-15 {
	font-size: 15px!important
}

.fs-16 {
	font-size: 16px!important
}

.fs-18 {
	font-size: 18px!important
}

.fs-20 {
	font-size: 20px!important
}

.fs-22 {
	font-size: 22px!important
}

.fs-24 {
	font-size: 24px!important
}

.fs-26 {
	font-size: 26px!important
}

.fs-36 {
	font-size: 36px!important
}

.fs-60 {
	font-size: 60px!important
}

.fw-300 {
	font-weight: 300!important
}

.fw-400 {
	font-weight: 400!important
}

.fw-500 {
	font-weight: 500!important
}

.fw-600 {
	font-weight: 600!important
}

.fw-700 {
	font-weight: 700!important
}

.line-height-3 {
	line-height: 1.45
}

.ls-2 {
	letter-spacing: 2px
}

.text-truncate {
	width: auto;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

.hover-text-underline:hover {
	transition: border-bottom-width .3s;
	border-bottom: 4px dashed
}

.black .box,.black .white {
	background-color: #202020
}

.black.app {
	background-color: #171717
}

.red .box,.red .white {
	background-color: #a30a0a
}

.red.app {
	background-color: #920909
}

.red .border {
	border: 1px solid rgba(255,232,42,.15)!important
}

.red .border-right {
	border-right: 1px solid rgba(255,232,42,.15)!important
}

.red .border-left {
	border-left: 1px solid rgba(255,232,42,.15)!important
}

.red .border-top {
	border-top: 1px solid rgba(255,232,42,.15)!important
}

.red .border-bottom {
	border-bottom: 1px solid rgba(255,232,42,.15)!important
}

.red .soft-layout {
	border: 1px solid rgba(255,232,42,.15)
}

.red #autosuggest__input:focus {
	border-color: #ffe82a!important;
	box-shadow: 0 1px 5px rgba(255,232,42,.1)
}

.red h1,.red h2,.red h3,.red h4,.red h5,.red h6 {
	color: #fff
}

.red a.active h1,.red a.active h2,.red a.active h3,.red a.active h4,.red a.active h5,.red a.active h6,.red a:active h1,.red a:active h2,.red a:active h3,.red a:active h4,.red a:active h5,.red a:active h6,.red a:focus h1,.red a:focus h2,.red a:focus h3,.red a:focus h4,.red a:focus h5,.red a:focus h6,.red a:hover h1,.red a:hover h2,.red a:hover h3,.red a:hover h4,.red a:hover h5,.red a:hover h6,.red code {
	color: #ffe82a
}

.red a.active .text-muted,.red a:active .text-muted,.red a:focus .text-muted,.red a:hover .text-muted {
	color: #979b9e!important
}

.red a.active .light-icon-more,.red a:active .light-icon-more,.red a:focus .light-icon-more,.red a:hover .light-icon-more {
	color: #ffe82a!important
}

.red a.active .macwk-app__extend *,.red a:active .macwk-app__extend *,.red a:focus .macwk-app__extend *,.red a:hover .macwk-app__extend * {
	color: #757575!important
}

.red a.active .macwk-app__body p,.red a:active .macwk-app__body p,.red a:focus .macwk-app__body p,.red a:hover .macwk-app__body p {
	color: #757575
}

.red .text-danger,.red .text-primary {
	color: #ffe82a!important
}

.red #macwk-svg-logo .stop-color-circle,.red #macwk-svg-logo .stop-color-default,.red #macwk-svg-logo .stop-color-default-linearGradient {
	stop-color: #ffe82a
}

.red .van-dialog__confirm {
	color: #fff!important
}

.red .btn-theme {
	color: #920909!important;
	background-color: #ffe82a!important
}

.red .btn-theme:focus,.red .btn-theme:hover {
	background-color: #ffe511!important
}

.red .macwk-sidebar .vsm--link:hover,.red .macwk-sidebar .vsm--link_active {
	color: #ffe82a
}

.bg-gradient-green {
	background-image: linear-gradient(45deg,#7fe496,#6edf8f)!important
}

.bg-gradient-orange {
	background-image: linear-gradient(45deg,#fe9078,#f1b87f)!important
}

.bg-gradient-blue {
	background-image: linear-gradient(45deg,#6cacfd,#93c8ff)!important
}

.bg-gradient-purple {
	background-image: linear-gradient(45deg,#a682e4,#c1a7e9)!important
}

.text-light {
	color: #999!important
}

a.text-light:focus,a.text-light:hover {
	color: #737373!important
}

.text-darken {
	color: #242428
}

.text-inherit {
	color: inherit
}

.hover-primary:hover {
	color: #50a1ff!important
}

#macwk-svg-logo .stop-color-default {
	stop-color: #50a1ff
}

#macwk-svg-logo .stop-color-default-linearGradient {
	stop-color: #0047f5
}

#macwk-svg-logo .stop-color-circle {
	stop-color: #3cd458
}

.bg-shape-holder {
	display: none
}

.light {
	background-color: #F3F5F7
}

.white {
	background-color: #fff
}

.light::-webkit-scrollbar-thumb,.light ::-webkit-scrollbar-thumb {
	background: rgba(0,0,0,.09)
}

.light::-webkit-scrollbar-track,.light ::-webkit-scrollbar-track {
	background: hsla(210,8%,51%,.09)
}

.light .MessageBody {
	color: #3c4248
}

.light .macwk-about-section .inner-container:after,.light .macwk-about-section .inner-container:before,.light .macwk-about-section .main-content {
	background: #fff
}

.light .soft-blockquote {
	color: #979b9e
}

.light .app-info p {
	color: #3c4248
}

.light .light-icon-more {
	color: #cad5e5
}

.light .bg-shape-holder {
	display: block
}

.light .btn-theme {
	color: #fff;
	background-color: #50a1ff
}

.light .btn-theme:active,.light .btn-theme:focus,.light .btn-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.light .btn-outline-theme {
	color: #50a1ff;
	border-color: #50a1ff
}

.light .btn-outline-theme:active,.light .btn-outline-theme:focus,.light .btn-outline-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.light h1,.light h2,.light h3,.light h4,.light h5,.light h6 {
	color: #3c4248
}

.light a.active h1,.light a.active h2,.light a.active h3,.light a.active h4,.light a.active h5,.light a.active h6,.light a:active h1,.light a:active h2,.light a:active h3,.light a:active h4,.light a:active h5,.light a:active h6,.light a:focus h1,.light a:focus h2,.light a:focus h3,.light a:focus h4,.light a:focus h5,.light a:focus h6,.light a:hover h1,.light a:hover h2,.light a:hover h3,.light a:hover h4,.light a:hover h5,.light a:hover h6 {
	color: #50a1ff
}

.light a.active .text-muted,.light a:active .text-muted,.light a:focus .text-muted,.light a:hover .text-muted {
	color: #979b9e!important
}

.light a.active .light-icon-more,.light a:active .light-icon-more,.light a:focus .light-icon-more,.light a:hover .light-icon-more {
	color: #50a1ff
}

.light a.active .macwk-app__extend *,.light a:active .macwk-app__extend *,.light a:focus .macwk-app__extend *,.light a:hover .macwk-app__extend * {
	color: #757575!important
}

.light a.active .macwk-app__body p,.light a:active .macwk-app__body p,.light a:focus .macwk-app__body p,.light a:hover .macwk-app__body p {
	color: #757575
}

a.active .hover-opacity-normal,a:active .hover-opacity-normal,a:focus .hover-opacity-normal,a:hover .hover-opacity-normal {
	opacity: 1!important;
	transition: all .1s
}

.black {
	color: #d4d4d5;
	background-color: #171717
}

.black .post-item:visited h3,.black .post-item h3,.black .text-darken {
	color: #d4d4d5
}

.black::-webkit-scrollbar-thumb,.black ::-webkit-scrollbar-thumb {
	background: #313131
}

.black::-webkit-scrollbar-track,.black ::-webkit-scrollbar-track {
	background: #171717
}

.black .article-content pre {
	background: #2e2e2e
}

.black .search-active:after {
	background-color: #50a1ff
}

.black .special-standard .single-special-member .hover-content {
	background: #262626;
	box-shadow: 8px 0 8.6px 1.4px rgba(8,8,8,.2)
}

.black .special-standard .single-special-member .info-meta {
	background: #262626;
	box-shadow: 5.994px 14.835px 30px 0 rgba(8,8,8,.2)
}

.black .macwk-about-section .main-content {
	background: #2b2b2b;
	box-shadow: 0 16px 25px 0 rgba(0,0,0,.03)
}

.black .macwk-about-section .inner-container:before {
	background: #2b2b2b;
	box-shadow: 0 15px 23px 0 rgba(35,49,64,.09)
}

.black .macwk-about-section .inner-container:after {
	background: #2b2b2b;
	box-shadow: 0 14px 21px 0 rgba(0,0,0,.03)
}

.black .macwk-footer .logo span {
	color: #d4d4d5
}

.black .van-dialog {
	border-radius: 25px;
	background-color: hsla(0,0%,9%,.9);
	box-shadow: 0 0 45px rgba(0,0,0,.8);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.black .van-dialog__header {
	color: #d4d4d5
}

.black .article-content {
	color: #d4d4d5
}

.black .article-content h2:not([class*=text-]):after,.black .article-content h2:not([class*=text-]):before {
	border-color: #50a1ff
}

.black .article-content h3 {
	color: #d4d4d5
}

.black .article-content h3:not([class*=text-]):after,.black .article-content h3:not([class*=text-]):before {
	border-color: transparent
}

.black .article-content blockquote {
	color: #ddddde
}

.black .article-content a code {
	color: #50a1ff
}

.black .article-content a code:hover {
	color: #1d86ff
}

.black .article-content b {
	font-weight: 700;
	color: #d4d4d5
}

.black .article-content code,.black .article-content pre code {
	line-height: 1.75;
	color: #e6e6e7
}

.black .article-content pre:after {
	color: #171717
}

.black .article-content h1 code,.black .article-content h2 code,.black .article-content h3 code,.black .article-content h4 code,.black .article-content h5 code,.black .article-content h6 code,.black .article-content li code,.black .article-content p code,.black .article-content span code,.black .article-content td code {
	color: #50a1ff;
	background-color: #171717
}

.black .autosuggest__results {
	background-color: #1d1d1d
}

.black .autosuggest__results:after {
	border-bottom-color: #1d1d1d
}

.black .autosuggest__results ul {
	background-color: #1d1d1d
}

.black .el-popover {
	background: #171717;
	border: 1px solid hsla(210,8%,51%,.09);
	color: #d4d4d5;
	box-shadow: 0 2px 12px 0 rgba(0,0,0,.1)
}

.black .app-content-info:before,.black .app-content-list:before {
	background-image: linear-gradient(#171717,hsla(0,0%,9%,.5) 30%,hsla(0,0%,9%,0))
}

.black .app-content-info:after,.black .app-content-list:after {
	background-image: linear-gradient(hsla(0,0%,9%,0),hsla(0,0%,9%,.5) 30%,#171717)
}

.black .form-control,.black .input-group-text,.black .macwk-emoji .input-group .search-clear {
	background-color: #2b2b2b;
	color: #d4d4d5
}

.black .macwk-emoji .nav .nav-link svg path {
	fill: #d4d4d5
}

.black .macwk-emoji .nav .nav-link.active svg path,.black .macwk-emoji .nav .nav-link:hover svg path {
	fill: #50a1ff
}

.black .app-header .app-header-main .app-header-logo span,.black .btn,.black button:not(.btn),.black input {
	color: #d4d4d5
}

.black button:not(.btn).active,.black button:not(.btn):active,.black button:not(.btn):focus,.black button:not(.btn):hover {
	color: #50a1ff!important
}

.black .el-switch__label {
	color: #d4d4d5!important
}

.black .btn-theme {
	color: #fff;
	background-color: #50a1ff
}

.black .btn-theme:active,.black .btn-theme:focus,.black .btn-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.black .btn-outline-theme {
	color: #50a1ff;
	border-color: #50a1ff
}

.black .btn-outline-theme:active,.black .btn-outline-theme:focus,.black .btn-outline-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.black a:not(.btn).active,.black a:not(.btn):active,.black a:not(.btn):hover,.black a:not(.btn):hover h1,.black a:not(.btn):hover h2,.black a:not(.btn):hover h3,.black a:not(.btn):hover h4,.black a:not(.btn):hover h5,.black a:not(.btn):hover h6 {
	color: #50a1ff
}

.black a:not(.btn):hover .text-muted {
	color: #d4d4d5!important;
	opacity: .7
}

.black a:not(.btn):hover .macwk-app__extend * {
	color: #d4d4d5!important
}

.black a:not(.btn):hover .macwk-app__body p {
	color: #d4d4d5
}

.black .snow-dot {
	opacity: .5
}

.black .macwk-app__hover--content {
	background: linear-gradient(130deg,#202020,#202020 50%,rgba(0,0,0,.4))
}

.black .macwk-app__header--icon--content {
	opacity: 1
}

.black .macwk-app.active,.black .macwk-app:hover {
	background-color: #202020;
	box-shadow: 0 0 36px rgba(3,3,3,.4)
}

.black .grid-list .macwk-app {
	background-image: linear-gradient(#1d1d1d,rgba(28,28,28,.2));
	box-shadow: 0 0 3px rgba(3,3,3,.35)
}

.black .grid-list .macwk-app h1,.black .grid-list .macwk-app h2,.black .grid-list .macwk-app h3,.black .grid-list .macwk-app h4,.black .grid-list .macwk-app h5,.black .grid-list .macwk-app h6 {
	color: #d4d4d5
}

.black .grid-list .macwk-app.active,.black .grid-list .macwk-app:hover {
	border-top-style: solid!important;
	background-color: #202020;
	box-shadow: 0 0 36px rgba(3,3,3,.4);
	z-index: 9
}

.black .siderbar-apps .van-tabs__line {
	background-color: #50a1ff
}

.black .siderbar-apps__body-item:hover {
	background-image: linear-gradient(#1c1c1c,hsla(0,0%,9%,.5) 30%,hsla(0,0%,9%,0));
	box-shadow: 0 0 26px rgba(3,3,3,.5)
}

.black .chat-container {
	box-shadow: 0 30px 48px rgba(0,0,0,.5);
	background-color: hsla(0,0%,9%,.7);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.black .chat-container .chat-header {
	background-color: #2b2b2b;
	color: #fff;
	box-shadow: 0 15px 25px -13px rgba(43,43,43,.5)
}

.black .chat-container .chat-body .MessageBody {
	background-color: #242424
}

.black .chat-container .chat-footer {
	border-top: 1px solid hsla(210,8%,51%,.09);
	box-shadow: 0 4px 23px 0 rgba(61,61,61,.5);
	background-color: #171717
}

.black .chat-container .chat-footer textarea:focus {
	border-top: 1px solid #3cd458
}

.black .chat-container .chat-footer textarea::-moz-placeholder {
	color: #d4d4d5;
	opacity: .5
}

.black .chat-container .chat-footer textarea:-ms-input-placeholder {
	color: #d4d4d5;
	opacity: .5
}

.black .chat-container .chat-footer textarea::placeholder {
	color: #d4d4d5;
	opacity: .5
}

.black .soft-layout {
	box-shadow: 0 30px 48px rgba(3,3,3,.5);
	border: 1px solid hsla(210,8%,51%,.09)
}

.black .soft-layout .layout-info .shadow-2 {
	border-bottom: 1px solid hsla(210,8%,51%,.09)
}

.black .soft-layout .layout-content-install:before {
	display: none
}

.black .soft-layout .layout-content-infos {
	background-image: linear-gradient(135deg,#1c1c1c,#1a1a1a 30%,#171717)
}

.black .text-muted {
	color: #d4d4d5!important;
	opacity: .7
}

.black.dk,.black .dk {
	background-color: #111
}

.black.bg,.black .bg {
	background-color: #171717
}

.primary {
	color: hsla(0,0%,100%,.9);
	background-color: #50a1ff
}

.primary .post-item:visited h3,.primary .post-item h3,.primary .text-darken {
	color: hsla(0,0%,100%,.9)
}

.primary::-webkit-scrollbar-thumb,.primary ::-webkit-scrollbar-thumb {
	background: #83bcff
}

.primary::-webkit-scrollbar-track,.primary ::-webkit-scrollbar-track {
	background: #50a1ff
}

.primary .article-content pre {
	background: #7ebaff
}

.primary .search-active:after {
	background-color: #50a1ff
}

.primary .special-standard .single-special-member .hover-content {
	background: #6fb1ff;
	box-shadow: 8px 0 8.6px 1.4px rgba(49,145,255,.2)
}

.primary .special-standard .single-special-member .info-meta {
	background: #6fb1ff;
	box-shadow: 5.994px 14.835px 30px 0 rgba(49,145,255,.2)
}

.primary .macwk-about-section .main-content {
	background: #79b7ff;
	box-shadow: 0 16px 25px 0 rgba(0,0,0,.03)
}

.primary .macwk-about-section .inner-container:before {
	background: #79b7ff;
	box-shadow: 0 15px 23px 0 rgba(35,49,64,.09)
}

.primary .macwk-about-section .inner-container:after {
	background: #79b7ff;
	box-shadow: 0 14px 21px 0 rgba(0,0,0,.03)
}

.primary .macwk-footer .logo span {
	color: hsla(0,0%,100%,.9)
}

.primary .van-dialog {
	border-radius: 25px;
	background-color: rgba(80,161,255,.9);
	box-shadow: 0 0 45px rgba(0,108,233,.8);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.primary .van-dialog__header {
	color: hsla(0,0%,100%,.9)
}

.primary .article-content {
	color: hsla(0,0%,100%,.9)
}

.primary .article-content h2:not([class*=text-]):after,.primary .article-content h2:not([class*=text-]):before {
	border-color: #50a1ff
}

.primary .article-content h3 {
	color: hsla(0,0%,100%,.9)
}

.primary .article-content h3:not([class*=text-]):after,.primary .article-content h3:not([class*=text-]):before {
	border-color: transparent
}

.primary .article-content blockquote {
	color: hsla(0,0%,100%,.9)
}

.primary .article-content a code {
	color: #50a1ff
}

.primary .article-content a code:hover {
	color: #1d86ff
}

.primary .article-content b {
	font-weight: 700;
	color: hsla(0,0%,100%,.9)
}

.primary .article-content code,.primary .article-content pre code {
	line-height: 1.75;
	color: hsla(0,0%,100%,.9)
}

.primary .article-content pre:after {
	color: #50a1ff
}

.primary .article-content h1 code,.primary .article-content h2 code,.primary .article-content h3 code,.primary .article-content h4 code,.primary .article-content h5 code,.primary .article-content h6 code,.primary .article-content li code,.primary .article-content p code,.primary .article-content span code,.primary .article-content td code {
	color: #50a1ff;
	background-color: #50a1ff
}

.primary .autosuggest__results {
	background-color: #5da8ff
}

.primary .autosuggest__results:after {
	border-bottom-color: #5da8ff
}

.primary .autosuggest__results ul {
	background-color: #5da8ff
}

.primary .el-popover {
	background: #50a1ff;
	border: 1px solid hsla(210,8%,51%,.09);
	color: hsla(0,0%,100%,.9);
	box-shadow: 0 2px 12px 0 rgba(0,0,0,.1)
}

.primary .app-content-info:before,.primary .app-content-list:before {
	background-image: linear-gradient(#50a1ff,rgba(80,161,255,.5) 30%,rgba(80,161,255,0))
}

.primary .app-content-info:after,.primary .app-content-list:after {
	background-image: linear-gradient(rgba(80,161,255,0),rgba(80,161,255,.5) 30%,#50a1ff)
}

.primary .form-control,.primary .input-group-text,.primary .macwk-emoji .input-group .search-clear {
	background-color: #79b7ff;
	color: hsla(0,0%,100%,.9)
}

.primary .macwk-emoji .nav .nav-link svg path {
	fill: hsla(0,0%,100%,.9)
}

.primary .macwk-emoji .nav .nav-link.active svg path,.primary .macwk-emoji .nav .nav-link:hover svg path {
	fill: #50a1ff
}

.primary .app-header .app-header-main .app-header-logo span,.primary .btn,.primary button:not(.btn),.primary input {
	color: hsla(0,0%,100%,.9)
}

.primary button:not(.btn).active,.primary button:not(.btn):active,.primary button:not(.btn):focus,.primary button:not(.btn):hover {
	color: #50a1ff!important
}

.primary .el-switch__label {
	color: hsla(0,0%,100%,.9)!important
}

.primary .btn-theme {
	color: #fff;
	background-color: #50a1ff
}

.primary .btn-theme:active,.primary .btn-theme:focus,.primary .btn-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.primary .btn-outline-theme {
	color: #50a1ff;
	border-color: #50a1ff
}

.primary .btn-outline-theme:active,.primary .btn-outline-theme:focus,.primary .btn-outline-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.primary a:not(.btn).active,.primary a:not(.btn):active,.primary a:not(.btn):hover,.primary a:not(.btn):hover h1,.primary a:not(.btn):hover h2,.primary a:not(.btn):hover h3,.primary a:not(.btn):hover h4,.primary a:not(.btn):hover h5,.primary a:not(.btn):hover h6 {
	color: #50a1ff
}

.primary a:not(.btn):hover .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.primary a:not(.btn):hover .macwk-app__extend * {
	color: hsla(0,0%,100%,.9)!important
}

.primary a:not(.btn):hover .macwk-app__body p {
	color: hsla(0,0%,100%,.9)
}

.primary .snow-dot {
	opacity: .5
}

.primary .macwk-app__hover--content {
	background: linear-gradient(130deg,#62abff,#62abff 50%,rgba(29,134,255,.4))
}

.primary .macwk-app__header--icon--content {
	opacity: 1
}

.primary .macwk-app.active,.primary .macwk-app:hover {
	background-color: #62abff;
	box-shadow: 0 0 36px rgba(39,139,255,.4)
}

.primary .grid-list .macwk-app {
	background-image: linear-gradient(#5ca7ff,rgba(90,166,255,.2));
	box-shadow: 0 0 3px rgba(39,139,255,.35)
}

.primary .grid-list .macwk-app h1,.primary .grid-list .macwk-app h2,.primary .grid-list .macwk-app h3,.primary .grid-list .macwk-app h4,.primary .grid-list .macwk-app h5,.primary .grid-list .macwk-app h6 {
	color: hsla(0,0%,100%,.9)
}

.primary .grid-list .macwk-app.active,.primary .grid-list .macwk-app:hover {
	border-top-style: solid!important;
	background-color: #62abff;
	box-shadow: 0 0 36px rgba(39,139,255,.4);
	z-index: 9
}

.primary .siderbar-apps .van-tabs__line {
	background-color: #50a1ff
}

.primary .siderbar-apps__body-item:hover {
	background-image: linear-gradient(#5aa6ff,rgba(80,161,255,.5) 30%,rgba(80,161,255,0));
	box-shadow: 0 0 26px rgba(39,139,255,.5)
}

.primary .chat-container {
	box-shadow: 0 30px 48px rgba(19,128,255,.5);
	background-color: rgba(80,161,255,.7);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.primary .chat-container .chat-header {
	background-color: #79b7ff;
	color: #fff;
	box-shadow: 0 15px 25px -13px rgba(121,183,255,.5)
}

.primary .chat-container .chat-body .MessageBody {
	background-color: #6aafff
}

.primary .chat-container .chat-footer {
	border-top: 1px solid hsla(210,8%,51%,.09);
	box-shadow: 0 4px 23px 0 rgba(157,202,255,.5);
	background-color: #50a1ff
}

.primary .chat-container .chat-footer textarea:focus {
	border-top: 1px solid #3cd458
}

.primary .chat-container .chat-footer textarea::-moz-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.primary .chat-container .chat-footer textarea:-ms-input-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.primary .chat-container .chat-footer textarea::placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.primary .soft-layout {
	box-shadow: 0 30px 48px rgba(39,139,255,.5);
	border: 1px solid hsla(210,8%,51%,.09)
}

.primary .soft-layout .layout-info .shadow-2 {
	border-bottom: 1px solid hsla(210,8%,51%,.09)
}

.primary .soft-layout .layout-content-install:before {
	display: none
}

.primary .soft-layout .layout-content-infos {
	background-image: linear-gradient(135deg,#5aa6ff,#55a4ff 30%,#50a1ff)
}

.primary .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.primary.dk,.primary .dk {
	background-color: #439aff
}

.primary.bg,.primary .bg {
	background-color: #50a1ff
}

.success {
	color: hsla(0,0%,100%,.9);
	background-color: #3cd458
}

.success .post-item:visited h3,.success .post-item h3,.success .text-darken {
	color: hsla(0,0%,100%,.9)
}

.success::-webkit-scrollbar-thumb,.success ::-webkit-scrollbar-thumb {
	background: #66dd7c
}

.success::-webkit-scrollbar-track,.success ::-webkit-scrollbar-track {
	background: #3cd458
}

.success .article-content pre {
	background: #62dc78
}

.success .search-active:after {
	background-color: #50a1ff
}

.success .special-standard .single-special-member .hover-content {
	background: #55da6d;
	box-shadow: 8px 0 8.6px 1.4px rgba(44,198,72,.2)
}

.success .special-standard .single-special-member .info-meta {
	background: #55da6d;
	box-shadow: 5.994px 14.835px 30px 0 rgba(44,198,72,.2)
}

.success .macwk-about-section .main-content {
	background: #5ddb75;
	box-shadow: 0 16px 25px 0 rgba(0,0,0,.03)
}

.success .macwk-about-section .inner-container:before {
	background: #5ddb75;
	box-shadow: 0 15px 23px 0 rgba(35,49,64,.09)
}

.success .macwk-about-section .inner-container:after {
	background: #5ddb75;
	box-shadow: 0 14px 21px 0 rgba(0,0,0,.03)
}

.success .macwk-footer .logo span {
	color: hsla(0,0%,100%,.9)
}

.success .van-dialog {
	border-radius: 25px;
	background-color: rgba(60,212,88,.9);
	box-shadow: 0 0 45px rgba(31,139,51,.8);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.success .van-dialog__header {
	color: hsla(0,0%,100%,.9)
}

.success .article-content {
	color: hsla(0,0%,100%,.9)
}

.success .article-content h2:not([class*=text-]):after,.success .article-content h2:not([class*=text-]):before {
	border-color: #50a1ff
}

.success .article-content h3 {
	color: hsla(0,0%,100%,.9)
}

.success .article-content h3:not([class*=text-]):after,.success .article-content h3:not([class*=text-]):before {
	border-color: transparent
}

.success .article-content blockquote {
	color: hsla(0,0%,100%,.9)
}

.success .article-content a code {
	color: #50a1ff
}

.success .article-content a code:hover {
	color: #1d86ff
}

.success .article-content b {
	font-weight: 700;
	color: hsla(0,0%,100%,.9)
}

.success .article-content code,.success .article-content pre code {
	line-height: 1.75;
	color: hsla(0,0%,100%,.9)
}

.success .article-content pre:after {
	color: #3cd458
}

.success .article-content h1 code,.success .article-content h2 code,.success .article-content h3 code,.success .article-content h4 code,.success .article-content h5 code,.success .article-content h6 code,.success .article-content li code,.success .article-content p code,.success .article-content span code,.success .article-content td code {
	color: #50a1ff;
	background-color: #3cd458
}

.success .autosuggest__results {
	background-color: #46d661
}

.success .autosuggest__results:after {
	border-bottom-color: #46d661
}

.success .autosuggest__results ul {
	background-color: #46d661
}

.success .el-popover {
	background: #3cd458;
	border: 1px solid hsla(210,8%,51%,.09);
	color: hsla(0,0%,100%,.9);
	box-shadow: 0 2px 12px 0 rgba(0,0,0,.1)
}

.success .app-content-info:before,.success .app-content-list:before {
	background-image: linear-gradient(#3cd458,rgba(60,212,88,.5) 30%,rgba(60,212,88,0))
}

.success .app-content-info:after,.success .app-content-list:after {
	background-image: linear-gradient(rgba(60,212,88,0),rgba(60,212,88,.5) 30%,#3cd458)
}

.success .form-control,.success .input-group-text,.success .macwk-emoji .input-group .search-clear {
	background-color: #5ddb75;
	color: hsla(0,0%,100%,.9)
}

.success .macwk-emoji .nav .nav-link svg path {
	fill: hsla(0,0%,100%,.9)
}

.success .macwk-emoji .nav .nav-link.active svg path,.success .macwk-emoji .nav .nav-link:hover svg path {
	fill: #50a1ff
}

.success .app-header .app-header-main .app-header-logo span,.success .btn,.success button:not(.btn),.success input {
	color: hsla(0,0%,100%,.9)
}

.success button:not(.btn).active,.success button:not(.btn):active,.success button:not(.btn):focus,.success button:not(.btn):hover {
	color: #50a1ff!important
}

.success .el-switch__label {
	color: hsla(0,0%,100%,.9)!important
}

.success .btn-theme {
	color: #fff;
	background-color: #50a1ff
}

.success .btn-theme:active,.success .btn-theme:focus,.success .btn-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.success .btn-outline-theme {
	color: #50a1ff;
	border-color: #50a1ff
}

.success .btn-outline-theme:active,.success .btn-outline-theme:focus,.success .btn-outline-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.success a:not(.btn).active,.success a:not(.btn):active,.success a:not(.btn):hover,.success a:not(.btn):hover h1,.success a:not(.btn):hover h2,.success a:not(.btn):hover h3,.success a:not(.btn):hover h4,.success a:not(.btn):hover h5,.success a:not(.btn):hover h6 {
	color: #50a1ff
}

.success a:not(.btn):hover .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.success a:not(.btn):hover .macwk-app__extend * {
	color: hsla(0,0%,100%,.9)!important
}

.success a:not(.btn):hover .macwk-app__body p {
	color: hsla(0,0%,100%,.9)
}

.success .snow-dot {
	opacity: .5
}

.success .macwk-app__hover--content {
	background: linear-gradient(130deg,#4bd765,#4bd765 50%,rgba(40,181,66,.4))
}

.success .macwk-app__header--icon--content {
	opacity: 1
}

.success .macwk-app.active,.success .macwk-app:hover {
	background-color: #4bd765;
	box-shadow: 0 0 36px rgba(42,189,69,.4)
}

.success .grid-list .macwk-app {
	background-image: linear-gradient(#46d660,rgba(68,214,95,.2));
	box-shadow: 0 0 3px rgba(42,189,69,.35)
}

.success .grid-list .macwk-app h1,.success .grid-list .macwk-app h2,.success .grid-list .macwk-app h3,.success .grid-list .macwk-app h4,.success .grid-list .macwk-app h5,.success .grid-list .macwk-app h6 {
	color: hsla(0,0%,100%,.9)
}

.success .grid-list .macwk-app.active,.success .grid-list .macwk-app:hover {
	border-top-style: solid!important;
	background-color: #4bd765;
	box-shadow: 0 0 36px rgba(42,189,69,.4);
	z-index: 9
}

.success .siderbar-apps .van-tabs__line {
	background-color: #50a1ff
}

.success .siderbar-apps__body-item:hover {
	background-image: linear-gradient(#44d65f,rgba(60,212,88,.5) 30%,rgba(60,212,88,0));
	box-shadow: 0 0 26px rgba(42,189,69,.5)
}

.success .chat-container {
	box-shadow: 0 30px 48px rgba(38,173,63,.5);
	background-color: rgba(60,212,88,.7);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.success .chat-container .chat-header {
	background-color: #5ddb75;
	color: #fff;
	box-shadow: 0 15px 25px -13px rgba(93,219,117,.5)
}

.success .chat-container .chat-body .MessageBody {
	background-color: #51d96a
}

.success .chat-container .chat-footer {
	border-top: 1px solid hsla(210,8%,51%,.09);
	box-shadow: 0 4px 23px 0 rgba(123,226,142,.5);
	background-color: #3cd458
}

.success .chat-container .chat-footer textarea:focus {
	border-top: 1px solid #3cd458
}

.success .chat-container .chat-footer textarea::-moz-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.success .chat-container .chat-footer textarea:-ms-input-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.success .chat-container .chat-footer textarea::placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.success .soft-layout {
	box-shadow: 0 30px 48px rgba(42,189,69,.5);
	border: 1px solid hsla(210,8%,51%,.09)
}

.success .soft-layout .layout-info .shadow-2 {
	border-bottom: 1px solid hsla(210,8%,51%,.09)
}

.success .soft-layout .layout-content-install:before {
	display: none
}

.success .soft-layout .layout-content-infos {
	background-image: linear-gradient(135deg,#44d65f,#40d55c 30%,#3cd458)
}

.success .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.success.dk,.success .dk {
	background-color: #32d24f
}

.success.bg,.success .bg {
	background-color: #3cd458
}

.info {
	color: hsla(0,0%,100%,.9);
	background-color: #926dde
}

.info .post-item:visited h3,.info .post-item h3,.info .text-darken {
	color: hsla(0,0%,100%,.9)
}

.info::-webkit-scrollbar-thumb,.info ::-webkit-scrollbar-thumb {
	background: #b197e7
}

.info::-webkit-scrollbar-track,.info ::-webkit-scrollbar-track {
	background: #926dde
}

.info .article-content pre {
	background: #ae92e6
}

.info .search-active:after {
	background-color: #50a1ff
}

.info .special-standard .single-special-member .hover-content {
	background: #a586e4;
	box-shadow: 8px 0 8.6px 1.4px rgba(127,84,216,.2)
}

.info .special-standard .single-special-member .info-meta {
	background: #a586e4;
	box-shadow: 5.994px 14.835px 30px 0 rgba(127,84,216,.2)
}

.info .macwk-about-section .main-content {
	background: #ab8ee6;
	box-shadow: 0 16px 25px 0 rgba(0,0,0,.03)
}

.info .macwk-about-section .inner-container:before {
	background: #ab8ee6;
	box-shadow: 0 15px 23px 0 rgba(35,49,64,.09)
}

.info .macwk-about-section .inner-container:after {
	background: #ab8ee6;
	box-shadow: 0 14px 21px 0 rgba(0,0,0,.03)
}

.info .macwk-footer .logo span {
	color: hsla(0,0%,100%,.9)
}

.info .van-dialog {
	border-radius: 25px;
	background-color: rgba(146,109,222,.9);
	box-shadow: 0 0 45px rgba(90,42,187,.8);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.info .van-dialog__header {
	color: hsla(0,0%,100%,.9)
}

.info .article-content {
	color: hsla(0,0%,100%,.9)
}

.info .article-content h2:not([class*=text-]):after,.info .article-content h2:not([class*=text-]):before {
	border-color: #50a1ff
}

.info .article-content h3 {
	color: hsla(0,0%,100%,.9)
}

.info .article-content h3:not([class*=text-]):after,.info .article-content h3:not([class*=text-]):before {
	border-color: transparent
}

.info .article-content blockquote {
	color: hsla(0,0%,100%,.9)
}

.info .article-content a code {
	color: #50a1ff
}

.info .article-content a code:hover {
	color: #1d86ff
}

.info .article-content b {
	font-weight: 700;
	color: hsla(0,0%,100%,.9)
}

.info .article-content code,.info .article-content pre code {
	line-height: 1.75;
	color: hsla(0,0%,100%,.9)
}

.info .article-content pre:after {
	color: #926dde
}

.info .article-content h1 code,.info .article-content h2 code,.info .article-content h3 code,.info .article-content h4 code,.info .article-content h5 code,.info .article-content h6 code,.info .article-content li code,.info .article-content p code,.info .article-content span code,.info .article-content td code {
	color: #50a1ff;
	background-color: #926dde
}

.info .autosuggest__results {
	background-color: #9a77e0
}

.info .autosuggest__results:after {
	border-bottom-color: #9a77e0
}

.info .autosuggest__results ul {
	background-color: #9a77e0
}

.info .el-popover {
	background: #926dde;
	border: 1px solid hsla(210,8%,51%,.09);
	color: hsla(0,0%,100%,.9);
	box-shadow: 0 2px 12px 0 rgba(0,0,0,.1)
}

.info .app-content-info:before,.info .app-content-list:before {
	background-image: linear-gradient(#926dde,rgba(146,109,222,.5) 30%,rgba(146,109,222,0))
}

.info .app-content-info:after,.info .app-content-list:after {
	background-image: linear-gradient(rgba(146,109,222,0),rgba(146,109,222,.5) 30%,#926dde)
}

.info .form-control,.info .input-group-text,.info .macwk-emoji .input-group .search-clear {
	background-color: #ab8ee6;
	color: hsla(0,0%,100%,.9)
}

.info .macwk-emoji .nav .nav-link svg path {
	fill: hsla(0,0%,100%,.9)
}

.info .macwk-emoji .nav .nav-link.active svg path,.info .macwk-emoji .nav .nav-link:hover svg path {
	fill: #50a1ff
}

.info .app-header .app-header-main .app-header-logo span,.info .btn,.info button:not(.btn),.info input {
	color: hsla(0,0%,100%,.9)
}

.info button:not(.btn).active,.info button:not(.btn):active,.info button:not(.btn):focus,.info button:not(.btn):hover {
	color: #50a1ff!important
}

.info .el-switch__label {
	color: hsla(0,0%,100%,.9)!important
}

.info .btn-theme {
	color: #fff;
	background-color: #50a1ff
}

.info .btn-theme:active,.info .btn-theme:focus,.info .btn-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.info .btn-outline-theme {
	color: #50a1ff;
	border-color: #50a1ff
}

.info .btn-outline-theme:active,.info .btn-outline-theme:focus,.info .btn-outline-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.info a:not(.btn).active,.info a:not(.btn):active,.info a:not(.btn):hover,.info a:not(.btn):hover h1,.info a:not(.btn):hover h2,.info a:not(.btn):hover h3,.info a:not(.btn):hover h4,.info a:not(.btn):hover h5,.info a:not(.btn):hover h6 {
	color: #50a1ff
}

.info a:not(.btn):hover .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.info a:not(.btn):hover .macwk-app__extend * {
	color: hsla(0,0%,100%,.9)!important
}

.info a:not(.btn):hover .macwk-app__body p {
	color: hsla(0,0%,100%,.9)
}

.info .snow-dot {
	opacity: .5
}

.info .macwk-app__hover--content {
	background: linear-gradient(130deg,#9d7ce1,#9d7ce1 50%,rgba(115,67,213,.4))
}

.info .macwk-app__header--icon--content {
	opacity: 1
}

.info .macwk-app.active,.info .macwk-app:hover {
	background-color: #9d7ce1;
	box-shadow: 0 0 36px rgba(121,76,214,.4)
}

.info .grid-list .macwk-app {
	background-image: linear-gradient(#9977e0,rgba(152,117,224,.2));
	box-shadow: 0 0 3px rgba(121,76,214,.35)
}

.info .grid-list .macwk-app h1,.info .grid-list .macwk-app h2,.info .grid-list .macwk-app h3,.info .grid-list .macwk-app h4,.info .grid-list .macwk-app h5,.info .grid-list .macwk-app h6 {
	color: hsla(0,0%,100%,.9)
}

.info .grid-list .macwk-app.active,.info .grid-list .macwk-app:hover {
	border-top-style: solid!important;
	background-color: #9d7ce1;
	box-shadow: 0 0 36px rgba(121,76,214,.4);
	z-index: 9
}

.info .siderbar-apps .van-tabs__line {
	background-color: #50a1ff
}

.info .siderbar-apps__body-item:hover {
	background-image: linear-gradient(#9875e0,rgba(146,109,222,.5) 30%,rgba(146,109,222,0));
	box-shadow: 0 0 26px rgba(121,76,214,.5)
}

.info .chat-container {
	box-shadow: 0 30px 48px rgba(109,59,211,.5);
	background-color: rgba(146,109,222,.7);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.info .chat-container .chat-header {
	background-color: #ab8ee6;
	color: #fff;
	box-shadow: 0 15px 25px -13px rgba(171,142,230,.5)
}

.info .chat-container .chat-body .MessageBody {
	background-color: #a282e3
}

.info .chat-container .chat-footer {
	border-top: 1px solid hsla(210,8%,51%,.09);
	box-shadow: 0 4px 23px 0 rgba(193,171,236,.5);
	background-color: #926dde
}

.info .chat-container .chat-footer textarea:focus {
	border-top: 1px solid #3cd458
}

.info .chat-container .chat-footer textarea::-moz-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.info .chat-container .chat-footer textarea:-ms-input-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.info .chat-container .chat-footer textarea::placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.info .soft-layout {
	box-shadow: 0 30px 48px rgba(121,76,214,.5);
	border: 1px solid hsla(210,8%,51%,.09)
}

.info .soft-layout .layout-info .shadow-2 {
	border-bottom: 1px solid hsla(210,8%,51%,.09)
}

.info .soft-layout .layout-content-install:before {
	display: none
}

.info .soft-layout .layout-content-infos {
	background-image: linear-gradient(135deg,#9875e0,#9571df 30%,#926dde)
}

.info .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.info.dk,.info .dk {
	background-color: #8a63dc
}

.info.bg,.info .bg {
	background-color: #926dde
}

.warning {
	color: hsla(0,0%,100%,.9);
	background-color: #ffba00
}

.warning .post-item:visited h3,.warning .post-item h3,.warning .text-darken {
	color: hsla(0,0%,100%,.9)
}

.warning::-webkit-scrollbar-thumb,.warning ::-webkit-scrollbar-thumb {
	background: #ffc833
}

.warning::-webkit-scrollbar-track,.warning ::-webkit-scrollbar-track {
	background: #ffba00
}

.warning .article-content pre {
	background: #ffc62e
}

.warning .search-active:after {
	background-color: #50a1ff
}

.warning .special-standard .single-special-member .hover-content {
	background: #ffc21f;
	box-shadow: 8px 0 8.6px 1.4px rgba(224,164,0,.2)
}

.warning .special-standard .single-special-member .info-meta {
	background: #ffc21f;
	box-shadow: 5.994px 14.835px 30px 0 rgba(224,164,0,.2)
}

.warning .macwk-about-section .main-content {
	background: #ffc529;
	box-shadow: 0 16px 25px 0 rgba(0,0,0,.03)
}

.warning .macwk-about-section .inner-container:before {
	background: #ffc529;
	box-shadow: 0 15px 23px 0 rgba(35,49,64,.09)
}

.warning .macwk-about-section .inner-container:after {
	background: #ffc529;
	box-shadow: 0 14px 21px 0 rgba(0,0,0,.03)
}

.warning .macwk-footer .logo span {
	color: hsla(0,0%,100%,.9)
}

.warning .van-dialog {
	border-radius: 25px;
	background-color: rgba(255,186,0,.9);
	box-shadow: 0 0 45px rgba(153,112,0,.8);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.warning .van-dialog__header {
	color: hsla(0,0%,100%,.9)
}

.warning .article-content {
	color: hsla(0,0%,100%,.9)
}

.warning .article-content h2:not([class*=text-]):after,.warning .article-content h2:not([class*=text-]):before {
	border-color: #50a1ff
}

.warning .article-content h3 {
	color: hsla(0,0%,100%,.9)
}

.warning .article-content h3:not([class*=text-]):after,.warning .article-content h3:not([class*=text-]):before {
	border-color: transparent
}

.warning .article-content blockquote {
	color: hsla(0,0%,100%,.9)
}

.warning .article-content a code {
	color: #50a1ff
}

.warning .article-content a code:hover {
	color: #1d86ff
}

.warning .article-content b {
	font-weight: 700;
	color: hsla(0,0%,100%,.9)
}

.warning .article-content code,.warning .article-content pre code {
	line-height: 1.75;
	color: hsla(0,0%,100%,.9)
}

.warning .article-content pre:after {
	color: #ffba00
}

.warning .article-content h1 code,.warning .article-content h2 code,.warning .article-content h3 code,.warning .article-content h4 code,.warning .article-content h5 code,.warning .article-content h6 code,.warning .article-content li code,.warning .article-content p code,.warning .article-content span code,.warning .article-content td code {
	color: #50a1ff;
	background-color: #ffba00
}

.warning .autosuggest__results {
	background-color: #ffbd0d
}

.warning .autosuggest__results:after {
	border-bottom-color: #ffbd0d
}

.warning .autosuggest__results ul {
	background-color: #ffbd0d
}

.warning .el-popover {
	background: #ffba00;
	border: 1px solid hsla(210,8%,51%,.09);
	color: hsla(0,0%,100%,.9);
	box-shadow: 0 2px 12px 0 rgba(0,0,0,.1)
}

.warning .app-content-info:before,.warning .app-content-list:before {
	background-image: linear-gradient(#ffba00,rgba(255,186,0,.5) 30%,rgba(255,186,0,0))
}

.warning .app-content-info:after,.warning .app-content-list:after {
	background-image: linear-gradient(rgba(255,186,0,0),rgba(255,186,0,.5) 30%,#ffba00)
}

.warning .form-control,.warning .input-group-text,.warning .macwk-emoji .input-group .search-clear {
	background-color: #ffc529;
	color: hsla(0,0%,100%,.9)
}

.warning .macwk-emoji .nav .nav-link svg path {
	fill: hsla(0,0%,100%,.9)
}

.warning .macwk-emoji .nav .nav-link.active svg path,.warning .macwk-emoji .nav .nav-link:hover svg path {
	fill: #50a1ff
}

.warning .app-header .app-header-main .app-header-logo span,.warning .btn,.warning button:not(.btn),.warning input {
	color: hsla(0,0%,100%,.9)
}

.warning button:not(.btn).active,.warning button:not(.btn):active,.warning button:not(.btn):focus,.warning button:not(.btn):hover {
	color: #50a1ff!important
}

.warning .el-switch__label {
	color: hsla(0,0%,100%,.9)!important
}

.warning .btn-theme {
	color: #fff;
	background-color: #50a1ff
}

.warning .btn-theme:active,.warning .btn-theme:focus,.warning .btn-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.warning .btn-outline-theme {
	color: #50a1ff;
	border-color: #50a1ff
}

.warning .btn-outline-theme:active,.warning .btn-outline-theme:focus,.warning .btn-outline-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.warning a:not(.btn).active,.warning a:not(.btn):active,.warning a:not(.btn):hover,.warning a:not(.btn):hover h1,.warning a:not(.btn):hover h2,.warning a:not(.btn):hover h3,.warning a:not(.btn):hover h4,.warning a:not(.btn):hover h5,.warning a:not(.btn):hover h6 {
	color: #50a1ff
}

.warning a:not(.btn):hover .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.warning a:not(.btn):hover .macwk-app__extend * {
	color: hsla(0,0%,100%,.9)!important
}

.warning a:not(.btn):hover .macwk-app__body p {
	color: hsla(0,0%,100%,.9)
}

.warning .snow-dot {
	opacity: .5
}

.warning .macwk-app__hover--content {
	background: linear-gradient(130deg,#ffbf12,#ffbf12 50%,rgba(204,149,0,.4))
}

.warning .macwk-app__header--icon--content {
	opacity: 1
}

.warning .macwk-app.active,.warning .macwk-app:hover {
	background-color: #ffbf12;
	box-shadow: 0 0 36px rgba(214,156,0,.4)
}

.warning .grid-list .macwk-app {
	background-image: linear-gradient(#ffbd0c,rgba(255,189,10,.2));
	box-shadow: 0 0 3px rgba(214,156,0,.35)
}

.warning .grid-list .macwk-app h1,.warning .grid-list .macwk-app h2,.warning .grid-list .macwk-app h3,.warning .grid-list .macwk-app h4,.warning .grid-list .macwk-app h5,.warning .grid-list .macwk-app h6 {
	color: hsla(0,0%,100%,.9)
}

.warning .grid-list .macwk-app.active,.warning .grid-list .macwk-app:hover {
	border-top-style: solid!important;
	background-color: #ffbf12;
	box-shadow: 0 0 36px rgba(214,156,0,.4);
	z-index: 9
}

.warning .siderbar-apps .van-tabs__line {
	background-color: #50a1ff
}

.warning .siderbar-apps__body-item:hover {
	background-image: linear-gradient(#ffbd0a,rgba(255,186,0,.5) 30%,rgba(255,186,0,0));
	box-shadow: 0 0 26px rgba(214,156,0,.5)
}

.warning .chat-container {
	box-shadow: 0 30px 48px rgba(194,141,0,.5);
	background-color: rgba(255,186,0,.7);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.warning .chat-container .chat-header {
	background-color: #ffc529;
	color: #fff;
	box-shadow: 0 15px 25px -13px rgba(255,197,41,.5)
}

.warning .chat-container .chat-body .MessageBody {
	background-color: #ffc11a
}

.warning .chat-container .chat-footer {
	border-top: 1px solid hsla(210,8%,51%,.09);
	box-shadow: 0 4px 23px 0 rgba(255,207,77,.5);
	background-color: #ffba00
}

.warning .chat-container .chat-footer textarea:focus {
	border-top: 1px solid #3cd458
}

.warning .chat-container .chat-footer textarea::-moz-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.warning .chat-container .chat-footer textarea:-ms-input-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.warning .chat-container .chat-footer textarea::placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.warning .soft-layout {
	box-shadow: 0 30px 48px rgba(214,156,0,.5);
	border: 1px solid hsla(210,8%,51%,.09)
}

.warning .soft-layout .layout-info .shadow-2 {
	border-bottom: 1px solid hsla(210,8%,51%,.09)
}

.warning .soft-layout .layout-content-install:before {
	display: none
}

.warning .soft-layout .layout-content-infos {
	background-image: linear-gradient(135deg,#ffbd0a,#ffbb05 30%,#ffba00)
}

.warning .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.warning.dk,.warning .dk {
	background-color: #f2b100
}

.warning.bg,.warning .bg {
	background-color: #ffba00
}

.danger {
	color: hsla(0,0%,100%,.9);
	background-color: #ff4954
}

.danger .post-item:visited h3,.danger .post-item h3,.danger .text-darken {
	color: hsla(0,0%,100%,.9)
}

.danger::-webkit-scrollbar-thumb,.danger ::-webkit-scrollbar-thumb {
	background: #ff7c84
}

.danger::-webkit-scrollbar-track,.danger ::-webkit-scrollbar-track {
	background: #ff4954
}

.danger .article-content pre {
	background: #ff777f
}

.danger .search-active:after {
	background-color: #50a1ff
}

.danger .special-standard .single-special-member .hover-content {
	background: #ff6871;
	box-shadow: 8px 0 8.6px 1.4px rgba(255,42,55,.2)
}

.danger .special-standard .single-special-member .info-meta {
	background: #ff6871;
	box-shadow: 5.994px 14.835px 30px 0 rgba(255,42,55,.2)
}

.danger .macwk-about-section .main-content {
	background: #ff727a;
	box-shadow: 0 16px 25px 0 rgba(0,0,0,.03)
}

.danger .macwk-about-section .inner-container:before {
	background: #ff727a;
	box-shadow: 0 15px 23px 0 rgba(35,49,64,.09)
}

.danger .macwk-about-section .inner-container:after {
	background: #ff727a;
	box-shadow: 0 14px 21px 0 rgba(0,0,0,.03)
}

.danger .macwk-footer .logo span {
	color: hsla(0,0%,100%,.9)
}

.danger .van-dialog {
	border-radius: 25px;
	background-color: rgba(255,73,84,.9);
	box-shadow: 0 0 45px rgba(226,0,14,.8);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.danger .van-dialog__header {
	color: hsla(0,0%,100%,.9)
}

.danger .article-content {
	color: hsla(0,0%,100%,.9)
}

.danger .article-content h2:not([class*=text-]):after,.danger .article-content h2:not([class*=text-]):before {
	border-color: #50a1ff
}

.danger .article-content h3 {
	color: hsla(0,0%,100%,.9)
}

.danger .article-content h3:not([class*=text-]):after,.danger .article-content h3:not([class*=text-]):before {
	border-color: transparent
}

.danger .article-content blockquote {
	color: hsla(0,0%,100%,.9)
}

.danger .article-content a code {
	color: #50a1ff
}

.danger .article-content a code:hover {
	color: #1d86ff
}

.danger .article-content b {
	font-weight: 700;
	color: hsla(0,0%,100%,.9)
}

.danger .article-content code,.danger .article-content pre code {
	line-height: 1.75;
	color: hsla(0,0%,100%,.9)
}

.danger .article-content pre:after {
	color: #ff4954
}

.danger .article-content h1 code,.danger .article-content h2 code,.danger .article-content h3 code,.danger .article-content h4 code,.danger .article-content h5 code,.danger .article-content h6 code,.danger .article-content li code,.danger .article-content p code,.danger .article-content span code,.danger .article-content td code {
	color: #50a1ff;
	background-color: #ff4954
}

.danger .autosuggest__results {
	background-color: #ff5660
}

.danger .autosuggest__results:after {
	border-bottom-color: #ff5660
}

.danger .autosuggest__results ul {
	background-color: #ff5660
}

.danger .el-popover {
	background: #ff4954;
	border: 1px solid hsla(210,8%,51%,.09);
	color: hsla(0,0%,100%,.9);
	box-shadow: 0 2px 12px 0 rgba(0,0,0,.1)
}

.danger .app-content-info:before,.danger .app-content-list:before {
	background-image: linear-gradient(#ff4954,rgba(255,73,84,.5) 30%,rgba(255,73,84,0))
}

.danger .app-content-info:after,.danger .app-content-list:after {
	background-image: linear-gradient(rgba(255,73,84,0),rgba(255,73,84,.5) 30%,#ff4954)
}

.danger .form-control,.danger .input-group-text,.danger .macwk-emoji .input-group .search-clear {
	background-color: #ff727a;
	color: hsla(0,0%,100%,.9)
}

.danger .macwk-emoji .nav .nav-link svg path {
	fill: hsla(0,0%,100%,.9)
}

.danger .macwk-emoji .nav .nav-link.active svg path,.danger .macwk-emoji .nav .nav-link:hover svg path {
	fill: #50a1ff
}

.danger .app-header .app-header-main .app-header-logo span,.danger .btn,.danger button:not(.btn),.danger input {
	color: hsla(0,0%,100%,.9)
}

.danger button:not(.btn).active,.danger button:not(.btn):active,.danger button:not(.btn):focus,.danger button:not(.btn):hover {
	color: #50a1ff!important
}

.danger .el-switch__label {
	color: hsla(0,0%,100%,.9)!important
}

.danger .btn-theme {
	color: #fff;
	background-color: #50a1ff
}

.danger .btn-theme:active,.danger .btn-theme:focus,.danger .btn-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.danger .btn-outline-theme {
	color: #50a1ff;
	border-color: #50a1ff
}

.danger .btn-outline-theme:active,.danger .btn-outline-theme:focus,.danger .btn-outline-theme:hover {
	color: #fff;
	background-color: #3c96ff
}

.danger a:not(.btn).active,.danger a:not(.btn):active,.danger a:not(.btn):hover,.danger a:not(.btn):hover h1,.danger a:not(.btn):hover h2,.danger a:not(.btn):hover h3,.danger a:not(.btn):hover h4,.danger a:not(.btn):hover h5,.danger a:not(.btn):hover h6 {
	color: #50a1ff
}

.danger a:not(.btn):hover .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.danger a:not(.btn):hover .macwk-app__extend * {
	color: hsla(0,0%,100%,.9)!important
}

.danger a:not(.btn):hover .macwk-app__body p {
	color: hsla(0,0%,100%,.9)
}

.danger .snow-dot {
	opacity: .5
}

.danger .macwk-app__hover--content {
	background: linear-gradient(130deg,#ff5b65,#ff5b65 50%,rgba(255,22,36,.4))
}

.danger .macwk-app__header--icon--content {
	opacity: 1
}

.danger .macwk-app.active,.danger .macwk-app:hover {
	background-color: #ff5b65;
	box-shadow: 0 0 36px rgba(255,32,46,.4)
}

.danger .grid-list .macwk-app {
	background-image: linear-gradient(#ff555f,rgba(255,83,94,.2));
	box-shadow: 0 0 3px rgba(255,32,46,.35)
}

.danger .grid-list .macwk-app h1,.danger .grid-list .macwk-app h2,.danger .grid-list .macwk-app h3,.danger .grid-list .macwk-app h4,.danger .grid-list .macwk-app h5,.danger .grid-list .macwk-app h6 {
	color: hsla(0,0%,100%,.9)
}

.danger .grid-list .macwk-app.active,.danger .grid-list .macwk-app:hover {
	border-top-style: solid!important;
	background-color: #ff5b65;
	box-shadow: 0 0 36px rgba(255,32,46,.4);
	z-index: 9
}

.danger .siderbar-apps .van-tabs__line {
	background-color: #50a1ff
}

.danger .siderbar-apps__body-item:hover {
	background-image: linear-gradient(#ff535e,rgba(255,73,84,.5) 30%,rgba(255,73,84,0));
	box-shadow: 0 0 26px rgba(255,32,46,.5)
}

.danger .chat-container {
	box-shadow: 0 30px 48px rgba(255,12,26,.5);
	background-color: rgba(255,73,84,.7);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.danger .chat-container .chat-header {
	background-color: #ff727a;
	color: #fff;
	box-shadow: 0 15px 25px -13px rgba(255,114,122,.5)
}

.danger .chat-container .chat-body .MessageBody {
	background-color: #ff636c
}

.danger .chat-container .chat-footer {
	border-top: 1px solid hsla(210,8%,51%,.09);
	box-shadow: 0 4px 23px 0 rgba(255,150,156,.5);
	background-color: #ff4954
}

.danger .chat-container .chat-footer textarea:focus {
	border-top: 1px solid #3cd458
}

.danger .chat-container .chat-footer textarea::-moz-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.danger .chat-container .chat-footer textarea:-ms-input-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.danger .chat-container .chat-footer textarea::placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.danger .soft-layout {
	box-shadow: 0 30px 48px rgba(255,32,46,.5);
	border: 1px solid hsla(210,8%,51%,.09)
}

.danger .soft-layout .layout-info .shadow-2 {
	border-bottom: 1px solid hsla(210,8%,51%,.09)
}

.danger .soft-layout .layout-content-install:before {
	display: none
}

.danger .soft-layout .layout-content-infos {
	background-image: linear-gradient(135deg,#ff535e,#ff4e59 30%,#ff4954)
}

.danger .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.danger.dk,.danger .dk {
	background-color: #ff3c48
}

.danger.bg,.danger .bg {
	background-color: #ff4954
}

.red {
	color: hsla(0,0%,100%,.9)
}

.red {
	background-color: #920909
}

.red .post-item:visited h3,.red .post-item h3,.red .text-darken {
	color: hsla(0,0%,100%,.9)
}

.red::-webkit-scrollbar-thumb,.red ::-webkit-scrollbar-thumb {
	background: #c20c0c
}

.red::-webkit-scrollbar-track,.red ::-webkit-scrollbar-track {
	background: #920909
}

.red .article-content pre {
	background: #bd0c0c
}

.red .search-active:after {
	background-color: #ffe82a
}

.red .special-standard .single-special-member .hover-content {
	background: #af0b0b;
	box-shadow: 8px 0 8.6px 1.4px rgba(117,7,7,.2)
}

.red .special-standard .single-special-member .info-meta {
	background: #af0b0b;
	box-shadow: 5.994px 14.835px 30px 0 rgba(117,7,7,.2)
}

.red .macwk-about-section .main-content {
	background: #b80b0b;
	box-shadow: 0 16px 25px 0 rgba(0,0,0,.03)
}

.red .macwk-about-section .inner-container:before {
	background: #b80b0b;
	box-shadow: 0 15px 23px 0 rgba(35,49,64,.09)
}

.red .macwk-about-section .inner-container:after {
	background: #b80b0b;
	box-shadow: 0 14px 21px 0 rgba(0,0,0,.03)
}

.red .macwk-footer .logo span {
	color: hsla(0,0%,100%,.9)
}

.red .van-dialog {
	border-radius: 25px;
	background-color: rgba(146,9,9,.9);
	box-shadow: 0 0 45px rgba(50,3,3,.8);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.red .van-dialog__header {
	color: hsla(0,0%,100%,.9)
}

.red .article-content {
	color: hsla(0,0%,100%,.9)
}

.red .article-content h2:not([class*=text-]):after,.red .article-content h2:not([class*=text-]):before {
	border-color: #ffe82a
}

.red .article-content h3 {
	color: hsla(0,0%,100%,.9)
}

.red .article-content h3:not([class*=text-]):after,.red .article-content h3:not([class*=text-]):before {
	border-color: transparent
}

.red .article-content blockquote {
	color: hsla(0,0%,100%,.9)
}

.red .article-content a code {
	color: #ffe82a
}

.red .article-content a code:hover {
	color: #f6db00
}

.red .article-content b {
	font-weight: 700;
	color: hsla(0,0%,100%,.9)
}

.red .article-content code,.red .article-content pre code {
	line-height: 1.75;
	color: hsla(0,0%,100%,.9)
}

.red .article-content pre:after {
	color: #920909
}

.red .article-content h1 code,.red .article-content h2 code,.red .article-content h3 code,.red .article-content h4 code,.red .article-content h5 code,.red .article-content h6 code,.red .article-content li code,.red .article-content p code,.red .article-content span code,.red .article-content td code {
	color: #ffe82a;
	background-color: #920909
}

.red .autosuggest__results {
	background-color: #9e0a0a
}

.red .autosuggest__results:after {
	border-bottom-color: #9e0a0a
}

.red .autosuggest__results ul {
	background-color: #9e0a0a
}

.red .el-popover {
	background: #920909;
	border: 1px solid hsla(210,8%,51%,.09);
	color: hsla(0,0%,100%,.9);
	box-shadow: 0 2px 12px 0 rgba(0,0,0,.1)
}

.red .app-content-info:before,.red .app-content-list:before {
	background-image: linear-gradient(#920909,rgba(146,9,9,.5) 30%,rgba(146,9,9,0))
}

.red .app-content-info:after,.red .app-content-list:after {
	background-image: linear-gradient(rgba(146,9,9,0),rgba(146,9,9,.5) 30%,#920909)
}

.red .form-control,.red .input-group-text,.red .macwk-emoji .input-group .search-clear {
	background-color: #b80b0b;
	color: hsla(0,0%,100%,.9)
}

.red .macwk-emoji .nav .nav-link svg path {
	fill: hsla(0,0%,100%,.9)
}

.red .macwk-emoji .nav .nav-link.active svg path,.red .macwk-emoji .nav .nav-link:hover svg path {
	fill: #ffe82a
}

.red .app-header .app-header-main .app-header-logo span,.red .btn,.red button:not(.btn),.red input {
	color: hsla(0,0%,100%,.9)
}

.red button:not(.btn).active,.red button:not(.btn):active,.red button:not(.btn):focus,.red button:not(.btn):hover {
	color: #ffe82a!important
}

.red .el-switch__label {
	color: hsla(0,0%,100%,.9)!important
}

.red .btn-theme {
	color: #fff;
	background-color: #ffe82a
}

.red .btn-theme:active,.red .btn-theme:focus,.red .btn-theme:hover {
	color: #fff;
	background-color: #ffe616
}

.red .btn-outline-theme {
	color: #ffe82a;
	border-color: #ffe82a
}

.red .btn-outline-theme:active,.red .btn-outline-theme:focus,.red .btn-outline-theme:hover {
	color: #fff;
	background-color: #ffe616
}

.red a:not(.btn).active,.red a:not(.btn):active,.red a:not(.btn):hover,.red a:not(.btn):hover h1,.red a:not(.btn):hover h2,.red a:not(.btn):hover h3,.red a:not(.btn):hover h4,.red a:not(.btn):hover h5,.red a:not(.btn):hover h6 {
	color: #ffe82a
}

.red a:not(.btn):hover .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.red a:not(.btn):hover .macwk-app__extend * {
	color: hsla(0,0%,100%,.9)!important
}

.red a:not(.btn):hover .macwk-app__body p {
	color: hsla(0,0%,100%,.9)
}

.red .snow-dot {
	opacity: .5
}

.red .macwk-app__hover--content {
	background: linear-gradient(130deg,#a30a0a,#a30a0a 50%,rgba(98,6,6,.4))
}

.red .macwk-app__header--icon--content {
	opacity: 1
}

.red .macwk-app.active,.red .macwk-app:hover {
	background-color: #a30a0a;
	box-shadow: 0 0 36px rgba(108,7,7,.4)
}

.red .grid-list .macwk-app {
	background-image: linear-gradient(#9d0a0a,rgba(156,10,10,.2));
	box-shadow: 0 0 3px rgba(108,7,7,.35)
}

.red .grid-list .macwk-app h1,.red .grid-list .macwk-app h2,.red .grid-list .macwk-app h3,.red .grid-list .macwk-app h4,.red .grid-list .macwk-app h5,.red .grid-list .macwk-app h6 {
	color: hsla(0,0%,100%,.9)
}

.red .grid-list .macwk-app.active,.red .grid-list .macwk-app:hover {
	border-top-style: solid!important;
	background-color: #a30a0a;
	box-shadow: 0 0 36px rgba(108,7,7,.4);
	z-index: 9
}

.red .siderbar-apps .van-tabs__line {
	background-color: #ffe82a
}

.red .siderbar-apps__body-item:hover {
	background-image: linear-gradient(#9c0a0a,rgba(146,9,9,.5) 30%,rgba(146,9,9,0));
	box-shadow: 0 0 26px rgba(108,7,7,.5)
}

.red .chat-container {
	box-shadow: 0 30px 48px rgba(88,5,5,.5);
	background-color: rgba(146,9,9,.7);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.red .chat-container .chat-header {
	background-color: #b80b0b;
	color: #fff;
	box-shadow: 0 15px 25px -13px rgba(184,11,11,.5)
}

.red .chat-container .chat-body .MessageBody {
	background-color: #aa0a0a
}

.red .chat-container .chat-footer {
	border-top: 1px solid hsla(210,8%,51%,.09);
	box-shadow: 0 4px 23px 0 rgba(218,13,13,.5);
	background-color: #920909
}

.red .chat-container .chat-footer textarea:focus {
	border-top: 1px solid #3cd458
}

.red .chat-container .chat-footer textarea::-moz-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.red .chat-container .chat-footer textarea:-ms-input-placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.red .chat-container .chat-footer textarea::placeholder {
	color: hsla(0,0%,100%,.9);
	opacity: .5
}

.red .soft-layout {
	box-shadow: 0 30px 48px rgba(108,7,7,.5);
	border: 1px solid hsla(210,8%,51%,.09)
}

.red .soft-layout .layout-info .shadow-2 {
	border-bottom: 1px solid hsla(210,8%,51%,.09)
}

.red .soft-layout .layout-content-install:before {
	display: none
}

.red .soft-layout .layout-content-infos {
	background-image: linear-gradient(135deg,#9c0a0a,#970909 30%,#920909)
}

.red .text-muted {
	color: hsla(0,0%,100%,.9)!important;
	opacity: .7
}

.red.dk,.red .dk {
	background-color: #860808
}

.red.bg,.red .bg {
	background-color: #920909
}

.no-bg {
	background: transparent!important
}

.today-update {
	width: 6px;
	height: 6px;
	display: inline-block;
	border-radius: 50%;
	background-color: #3cd458;
	vertical-align: 1px;
	margin-right: 3px
}

.feature-block-three {
	position: relative;
	display: block;
	padding: 20px;
	z-index: 9
}

.feature-block-three .icon-box {
	width: 160px;
	position: relative
}

.feature-block-three .icon-box img {
	margin: 0 auto;
	position: relative;
	transition: all .3s
}

.feature-block-three .text {
	width: calc(100% - 180px);
	padding-left: 38px
}

.feature-block-three .text h5 {
	transition: all .3s
}

.feature-block-three .read-more {
	font-size: 35px;
	line-height: normal;
	transition: all .3s
}

.feature-block-three:hover .text * {
	color: #50a1ff
}

.grid-change a {
	margin-right: 10px;
	transition: none
}

.grid-change a .i-con {
	top: 3px;
	transition: none
}

.grid-change a.active {
	transition: none
}

.grid-change a:last-child {
	margin-right: 0
}

.soft-layout {
	box-shadow: 0 16px 48px #e7ebf6;
	width: 1410px;
	margin: 0 auto;
	overflow: hidden
}

.layout-header .header-app {
	padding: .5rem;
	display: flex
}

.layout-header .header-app .app-icon {
	height: 128px;
	width: 128px;
	min-width: 128px
}

.layout-content-install {
	position: relative
}

.layout-content-install:before {
	content: url(../image/2.png);
	position: absolute;
	top: -100px;
	left: -200px
}

.layout-content-infos {
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	padding: 80px 0 100px;
	background-image: linear-gradient(135deg,#f4f7fe,#fff 50%,#f4f7fe);
	position: relative
}

/* .soft-layout .layout-content-install:before {
	content: "";
	top: -220px;
	left: -450px;
	width: 725px;
	height: 651px;
	background-image: url(data:image/svg+xml;
	base64,PHN2ZyB3aWR0aD0iNzI1IiBoZWlnaHQ9IjY1MSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+PGRlZnM+PHBhdGggZD0iTTY3OC42MDMgNjQzLjg1OGMxMTEuODItNTkuMTE1LTE1Ljc3LTE4NS4zNDQtMTUuNzctMzIxLjQ4MyAwLTEzNi4xMzgtLjI4NC0zNDAuMzcxLTEzNi40MjItMzIxLjEwNS0xMzYuMTM4IDE5LjI2Ni05NC4yODggMTg3LjE2Ny00NDEuOSAyNjkuMTQ4LTM0Ny42MTQgODEuOTggNDgyLjI3MyA0MzIuNTU0IDU5NC4wOTIgMzczLjQ0eiIgaWQ9ImEiLz48L2RlZnM+PHVzZSBmaWxsPSIjRjRGN0ZFIiB0cmFuc2Zvcm09Im1hdHJpeCgtMSAwIDAgMSA3MjQuNTE4IDApIiB4bGluazpocmVmPSIjYSIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+);opacity: .9;
	background-repeat: no-repeat
} */

.soft-layout .layout-content-infos {
	border-top: 0;
	border-bottom: 0;
	background-image: linear-gradient(135deg,#f4f7fe,#fff 50%,#f4f7fe)
}

.soft-layout code {
	padding-left: .25rem;
	padding-right: .25rem;
	color: #065a9b;
	background-color: #eee3fc
}

.circle-fill {
	fill: #c6fdf3
}

.path-fill {
	fill: #55ebd0
}

.path-fill-1 {
	fill: #1adab7
}

.el-tag--small {
	line-height: 18px
}

.el-dialog__headerbtn {
	display: none;
	position: fixed;
	top: -20px;
	right: 20px;
	font-size: 130px
}

.el-dialog__headerbtn .el-dialog__close {
	color: #fff
}

.soft-blockquote {
	position: relative;
	border-left: 0;
	padding: 85px 0 30px;
	width: 700px;
	margin: 0 auto;
	font-size: 18px;
	text-indent: 38px;
	line-height: 2
}

.soft-blockquote:before {
	content: "";
	display: block;
	opacity: 1;
	position: absolute;
	left: calc(50% - 32px);
	top: -10px;
	width: 64px;
	height: 64px;
	background-image: url(../image/icon35.svg);
	background-repeat: no-repeat;
	background-position: 0;
	background-size: 90%
}

.soft-blockquote p {
	margin: 0 0 20px;
	line-height: 30px
}

.soft-blockquote h5 {
	font-style: normal;
	font-weight: 600;
	font-size: 22px;
	margin-top: 50px;
	margin-bottom: 26px;
	line-height: 140%
}

.soft-blockquote p:first-child {
	margin-bottom: 40px;
	line-height: 2
}

.soft-blockquote p:not(:first-child) {
	font-size: 16px
}

.soft-blockquote ol,.soft-blockquote ul {
	list-style-position: inside;
	padding-top: .25rem;
	padding-bottom: .25rem;
	padding-left: 0
}

.soft-blockquote ol li,.soft-blockquote ul li {
	padding-top: .3rem;
	padding-bottom: .3rem;
	font-size: 15px
}

.soft-blockquote ol ol,.soft-blockquote ol ul,.soft-blockquote ul ol,.soft-blockquote ul ul {
	padding-left: 1rem;
	padding-top: .25rem
}

.soft-blockquote ol {
	list-style-type: decimal
}

.soft-blockquote ul {
	list-style-type: circle
}

.zanUp .likeanimation {
	position: absolute;
	right: 8px;
	top: 8px
}

.layout-info a:active,.layout-info a:focus,.layout-info a:hover {
	color: #50a1ff
}

.fiexd-comments-bar {
	position: fixed;
	bottom: -60px;
	opacity: 0;
	width: 260px;
	right: 20px;
	color: #fff;
	transition: all .3s;
	height: 60px;
	box-shadow: 0 4px 12px rgba(0,0,0,.3);
	background: #50a1ff;
	border-radius: 8px 8px 0 0;
	display: flex;
	padding: 0 .9em;
	align-items: center
}

.fiexd-comments-bar .comment-icon-path {
	fill: #50a1ff
}

.fiexd-comments-bar:hover {
	background-color: #278bff
}

.fiexd-comments-bar:hover .comment-icon-path {
	fill: #278bff
}

.fiexd-comments-bar.is-scroll {
	bottom: 0;
	opacity: 1;
	box-shadow: 0 13px 35px -12px rgba(35,35,35,.35);
	z-index: 2000
}

.chat-container {
	z-index: 20;
	border-radius: 10px!important;
	box-shadow: 0 5px 25px 0 rgba(0,0,0,.13);
	background-color: #fff;
	width: 360px;
	height: 80%;
	left: auto;
	right: 20px;
	bottom: 20px
}

.chat-container .chat-header {
	background-color: #50a1ff;
	color: #fff;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	display: flex;
	align-items: center;
	flex-shrink: 0;
	height: 60px;
	font-size: 20px;
	font-weight: 500;
	box-shadow: 0 15px 25px -13px rgba(0,0,0,.13);
	padding: 0 .8rem;
	overflow: hidden;
	z-index: 5
}

.chat-container .chat-header .icon-close {
	position: absolute;
	right: 20px;
	top: 18px
}

.chat-container .chat-body {
	height: calc(100% - 200px);
	padding: 0 .8rem;
	overflow-y: auto
}

.chat-container .chat-body .MessageBody {
	background-color: #f8f8f8;
	padding: .4rem .85rem;
	border-radius: 12px;
	font-size: 13px;
	display: inline-block;
	word-break: break-all;
	word-wrap: break-word
}

.chat-container .chat-body .MessageBody p:first-child {
	margin-bottom: 0
}

.chat-container .chat-body .MessageBody code,.chat-container .chat-body .MessageBody p {
	word-break: break-all;
	word-wrap: break-word
}

.chat-container .chat-footer {
	height: 140px;
	padding: 0;
	overflow: hidden;
	border-top: 1px solid #e6ecef;
	box-shadow: 0 4px 23px 0 rgba(0,0,0,.15);
	background-color: #fff;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px
}

.chat-container .chat-footer textarea {
	width: 100%;
	background-color: transparent;
	-webkit-user-select: text;
	-moz-user-select: text;
	-ms-user-select: text;
	user-select: text;
	resize: none;
	padding: 10px 15px;
	display: block;
	height: 107px;
	border: none;
	border-top: 1px solid transparent;
	outline: 0
}

.chat-container .chat-footer textarea:focus {
	border-top: 1px solid #3cd458
}

.chat-container .chat-footer textarea::-moz-placeholder {
	font-size: 13px;
	opacity: .7
}

.chat-container .chat-footer textarea:-ms-input-placeholder {
	font-size: 13px;
	opacity: .7
}

.chat-container .chat-footer textarea::placeholder {
	font-size: 13px;
	opacity: .7
}

.zanUp .likeanimation {
	opacity: 0
}

.zanUp .likeanimation.macwk-animation {
	opacity: 1
}

.siderbar-apps {
	position: relative;
	border-radius: 15px 0 15px 0;
	padding: 0 0 1px;
	overflow: hidden
}

.siderbar-apps .van-tabs--line .van-tabs__wrap {
	height: 48px
}

.siderbar-apps .van-tabs__nav {
	background-color: transparent
}

.siderbar-apps .van-tabs__line {
	background-color: #50a1ff
}

.siderbar-apps__header {
	padding: 12px 20px
}

.siderbar-apps__body {
	position: relative;
	transition: all .3s
}

.siderbar-apps__body-item {
	padding: 10px 25px 33px;
	border-radius: 15px 15px 0 0;
	margin-bottom: -20px;
	background-color: #f9fbfd
}

.siderbar-apps__body-item:hover {
	transition: all .3s;
	background-image: linear-gradient(#fff,hsla(0,0%,100%,.5) 30%,hsla(0,0%,100%,0));
	box-shadow: 0 0 26px rgba(80,161,255,.1)
}

.siderbar-apps .siderbar-apps__body .siderbar-apps__body-item:last-child {
	padding-bottom: 18px;
	margin-bottom: 0;
	border-bottom-right-radius: 0
}

.siderbar-apps.new-post {
	border-radius: 15px 0 15px 0;
	padding: 0
}

.siderbar-apps.new-post .siderbar-apps__header {
	padding: 12px 20px 12px
}

.siderbar-apps.new-post .siderbar-apps__body-item {
	padding: 10px 25px 20px;
	border-radius: 15px 15px 0 0;
	margin-bottom: 0;
	background-color: transparent
}

.siderbar-apps.new-post .siderbar-apps__body-item:last-child {
	padding-bottom: 18px
}

.menu {
	line-height: 1
}

.menu__list {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none
}

.menu__item,.menu__link {
	display: block
}

.menu__link {
	padding: 0 1em;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none
}

.menu__link:focus,.menu__link:hover {
	outline: none
}

.article-menu .menu__link {
	width: 90px
}

.article-menu .menu__line {
	width: 90px;
	border-width: 0 36px
}

.search-active {
	position: relative
}

.search-active:after {
	content: "";
	position: absolute;
	left: calc(50% - 8px);
	width: 16px;
	height: 3px;
	bottom: 0;
	background-color: #50a1ff
}

.comment-form-group .form-control {
	border: 1px solid hsla(210,8%,51%,.2)
}

.comment-form-group .form-control::-moz-placeholder {
	color: #979b9e
}

.comment-form-group .form-control:-ms-input-placeholder {
	color: #979b9e
}

.comment-form-group .form-control::placeholder {
	color: #979b9e
}

.index-banner-image-two {
	position: absolute;
	right: 50px;
	top: 10px;
	width: 500px;
	height: calc(100% - 40px)
}

.index-banner-image-two img {
	height: 400px
}

.app-header-main+div {
	transition: none!important;
	transform: none!important;
	transition-delay: unset!important;
	transition-property: none!important
}

body:not(.navigation-with-keyboard) :not(input):focus {
	outline: 0
}

@-webkit-keyframes c {
	0% {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

@keyframes c {
	0% {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

@media (min-width:1500px) {
	.soft-layout {
		width: 1410px
	}

	.soft-layout .container {
		max-width: 1240px
	}
}

@media (min-width:1260px) and (max-width:1499.98px) {

	.soft-layout {
		width: 1170px
	}

	.soft-layout .container {
		max-width: 1080px
	}

	.layout-header .header-app {
		padding: 0;
		display: flex
	}

	.layout-header .header-app .app-icon {
		height: 96px;
		width: 96px;
		min-width: 96px
	}

	.layout-header .header-app .h2,.layout-header .header-app h2 {
		font-size: 1.875rem
	}

	.layout-header .header-app .list-body {
		padding-right: 2rem
	}
}

@media (min-width:1260px) and (max-width:1499.98px) {
	.layout-header {
		padding-top: 0!important;
		padding-bottom: 1rem!important
	}
}

@media (max-width:767.98px) {
	.app {
		min-width: 100%
	}

	.mobile-layout .macwk-app {
		padding: 15px 0;
		margin-bottom: 0!important;
		border-width: 0!important;
		box-shadow: none!important;
		overflow: unset
	}

	.mobile-layout .macwk-app:after {
		content: "";
		height: 1px;
		width: calc(100% - 4rem);
		position: absolute;
		bottom: 0;
		left: 2rem;
		background-color: hsla(210,8%,51%,.09);
		opacity: .7
	}

	.mobile-layout .macwk-app__header--icon--content {
		--sizem: 52px;
		width: var(--sizem);
		height: var(--sizem);
		top: 0;
		left: 0;
		background-image: var(--img);
		background-size: cover;
		background-repeat: no-repeat;
		border-radius: 55px;
		opacity: .6;
		transform: scale(1) translateX(0);
		filter: blur(30px) opacity(70%);
		z-index: 0;
		transition-delay: .05s;
		transition: transform .3s ease-in-out
	}

	.mobile-layout .macwk-app__body {
		padding-bottom: 0!important;
		height: auto!important
	}

	.mobile-layout .macwk-app__hover--content,.mobile-layout .macwk-footer {
		display: none
	}
}

@-webkit-keyframes blink {
	50% {
		opacity: 1
	}
}

@keyframes blink {
	50% {
		opacity: 1
	}
}

@-webkit-keyframes bulge {
	50% {
		transform: scale(1.05)
	}
}

@keyframes bulge {
	50% {
		transform: scale(1.05)
	}
}

@media (min-width:992px) and (max-width:1259.98px) {
	.layout-header .header-app .app-icon {
		height: 96px;
		width: 96px;
		min-width: 96px
	}

	.app-header-main,.app-main {
		width: 962px
	}

	.grid-list .app-content-info {
		display: none
	}

	.soft-layout {
		width: 962px
	}

	.soft-layout .container {
		max-width: 860px
	}

	.layout-header .header-app .h2,.layout-header .header-app h2 {
		font-size: 1.7rem
	}

	.layout-header .header-app .zanUp {
		display: none
	}

	.layout-header .device-macbook-pro {
		transform: scale(.6);
		margin-left: -120px
	}

	.content-header h3,.content-header h4 {
		padding-left: 30px
	}

	.content-header h3 span,.content-header h4 span {
		display: none
	}

	.grid-grid .mw-col {
		width: 33.333333%
	}

	.grid-grid .mw-col,.special-standard .col-3 {
		max-width: 33.333333%;
		flex: 0 0 33.333333%
	}

	.special-box-list h4 {
		font-size: 18px
	}

	.special-box-list .macwk-app__body {
		padding-bottom: 10px!important
	}

	.special-box-list .macwk-app__extend {
		display: none
	}

	.article-details .article-details-fg {
		width: 90%
	}

	.article-banner {
		width: 100%
	}

	.article-banner .imgBox {
		width: 100%;
		max-width: 100%
	}

	.grid-change a:first-child {
		display: none
	}

	.index-banner .w-600.pl-10 {
		width: 460px!important;
		min-width: 460px!important;
		padding-left: 80px!important
	}

	.index-banner .big-round-one,.index-banner .big-round-three,.index-banner .big-round-two {
		display: none
	}

	.index-banner .index-banner-image-two {
		top: 40px;
		width: 400px
	}

	.index-banner .index-banner-image-two img {
		height: 340px
	}

	.app-header .app-header-main {
		width: 962px
	}

	.app-header .app-header-main .app-header-logo {
		width: 150px;
		min-width: 150px
	}

	.app-header .app-header-main .app-header-nav .nav-link {
		padding-left: 1rem;
		padding-right: 1rem
	}

	.app-header .app-header-main .app-header-nav .nav-link:last-child {
		display: none
	}

	.app-header .app-header-main .app-header-search {
		width: 300px;
		margin-right: 20px
	}

	.app-header .app-header-main .app-header-user {
		width: 100px
	}
}

@media (min-width:768px) and (max-width:991.98px) {
	.app-content-bottom .el-pagination {
		height: 40px
	}

	.app-content-bottom .el-pagination button,.app-content-bottom .el-pagination li,.app-content-bottom .el-pagination span:not([class*=suffix]) {
		font-size: 18px;
		min-width: 40px;
		height: 40px;
		line-height: 40px
	}

	.grid-list .app-content-info {
		display: none
	}

	.soft-layout {
		width: 738px
	}

	.soft-layout .container {
		max-width: 660px
	}

	.soft-layout .app-info .fs-18 {
		font-size: 16px!important
	}

	.soft-layout #step-content .soft-blockquote {
		width: 90%;
		font-size: 16px
	}

	.grid-list .macwk-app__extend--comment,.grid-list .macwk-app__extend--os {
		display: none
	}

	.grid-list .macwk-app__extend {
		flex: unset;
		margin-right: 20px
	}

	.grid-list .macwk-app__extend--download {
		width: 80px
	}

	.article-menu .menu__item:nth-child(4),.article-menu .menu__item:nth-child(5),.macwk-soft-list-menu .menu__item:nth-child(4),.macwk-soft-list-menu .menu__item:nth-child(5) {
		display: none
	}

	.layout-header {
		padding-left: 150px;
		padding-right: 150px
	}

	.layout-header .header-app .h2,.layout-header .header-app h2 {
		font-size: 2rem
	}

	.layout-header .device-macbook-pro {
		transform: scale(.9);
		margin-left: -80px
	}

	.content-header h3,.content-header h4 {
		padding-left: 30px
	}

	.content-header h3 span,.content-header h4 span {
		display: none
	}

	.grid-grid .mw-col {
		width: 50%
	}

	.grid-grid .mw-col,.special-standard .col-3 {
		max-width: 50%;
		flex: 0 0 50%
	}

	.special-content header h1 {
		font-size: 48px!important
	}

	.special-box-list .w-c-6 {
		width: 33.3333333%
	}

	.special-box-list h4 {
		font-size: 18px
	}

	.special-box-list .macwk-app__body {
		padding-bottom: 10px!important
	}

	.special-box-list .macwk-app__extend {
		display: none
	}

	.article-details .article-details-fg {
		width: 90%
	}

	.article-banner {
		width: 100%
	}

	.article-banner .imgBox {
		width: 100%;
		max-width: 100%
	}

	.grid-change a:first-child {
		display: none
	}

	.index-special h6 {
		font-size: .9rem
	}

	.index-special .row {
		margin-right: -10px;
		margin-left: -10px
	}

	.index-special .col-3 {
		padding-right: 10px;
		padding-left: 10px
	}

	.index-banner .w-600.pl-10 {
		width: 100%!important;
		min-width: 100%!important;
		padding: 0 80px!important;
		text-align: center
	}

	.index-banner .big-round-one,.index-banner .big-round-three,.index-banner .big-round-two {
		display: none
	}

	.index-banner .index-banner-image-two {
		opacity: .1
	}

	.macwk-footer .nav {
		display: none
	}

	.app-header-main,.app-header .app-header-main,.app-main {
		width: 738px
	}

	.app-header .app-header-main .app-header-logo {
		width: 150px;
		min-width: 150px
	}

	.app-header .app-header-main .app-header-nav .nav-link {
		padding-left: 1rem;
		padding-right: 1rem
	}

	.app-header .app-header-main .app-header-nav .nav-link:last-child {
		display: none
	}

	.app-header .app-header-main .app-header-search {
		width: 260px;
		margin-right: 0
	}

	.app-header .app-header-main .app-header-user {
		display: none!important
	}
}

.mobile-model {
	display: none
}

@media (max-width:767.98px) {
	.pc-model {
		display: none
	}

	.mobile-model {
		display: block
	}

	.macwk-privacy {
		width: 100%;
		margin-top: 0!important;
		margin-bottom: 0!important
	}

	.macwk-privacy .w-c-2 {
		display: none;
		width: 30%
	}

	.macwk-privacy .w-c-22 {
		width: 100%!important
	}

	.macwk-privacy .h-150 {
		height: 80px!important
	}
}

@-webkit-keyframes bounce-in {
	0% {
		transform: scale(0)
	}

	50% {
		transform: scale(1.5)
	}

	to {
		transform: scale(1)
	}
}

@keyframes bounce-in {
	0% {
		transform: scale(0)
	}

	50% {
		transform: scale(1.5)
	}

	to {
		transform: scale(1)
	}
}

@-webkit-keyframes bounce-out {
	0% {
		transform: scale(1)
	}

	50% {
		transform: scale(1.5)
	}

	to {
		transform: scale(0)
	}
}

@keyframes bounce-out {
	0% {
		transform: scale(1)
	}

	50% {
		transform: scale(1.5)
	}

	to {
		transform: scale(0)
	}
}

pre::-webkit-scrollbar-track-piece {
	background-color: #f2f2f2
}

pre::-webkit-scrollbar {
	width: 9px;
	height: 12px
}

pre::-webkit-scrollbar-thumb {
	background-color: #bbb;
	background-clip: padding-box;
	min-height: 28px;
	border-radius: 0 0 8px 8px
}

pre::-webkit-scrollbar-thumb:hover {
	background-color: #50a1ff
}

.adBanner {
	background-color: transparent;
	height: 1px;
	width: 1px;
	opacity: 0
}


